css:
.grid { display: -webkit-flex; display: flex; } .col { background: #ddd; padding: 30px; } .fluid { flex: 1; } .fixed { background: #ffa; width: 400px; }
html:
<div class="grid"> <div class="col fluid-25"> <h2>Fluid column - 25%</h2> <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p> </div> <div class="col fluid-50"> <h2>Fluid column - 50%</h2> <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p> </div> <div class="col fluid-25"> <h2>Fluid column - 25%</h2> <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p> </div> </div>