HTML CSS
(a quick guide)
<div class="demo"> <div>1</div> <div><p>2</p> <p>2</p></div> <div><p>3</p> <p>3</p> <p>3</p></div> </div>
.demo { display: flex; } .demo > * { flex: 1; }
.demo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.demo { display: table; width: 100%; } .demo > * { display: table-cell; width: 33%; }
.demo { overflow: hidden; } .demo > * { float: left; width: 33%; padding: 10px 10px 99999px 10px; margin-bottom: -99999px; }
.demo { overflow: hidden; background-image: linear-gradient(to right, #ffebeb 33%, #d5ffd2 33%, #d5ffd2 66%, #eae9ff 66%, #eae9ff 100%); } .demo > * { float: left; width: 33%; }