Hacker News new | ask | show | jobs
by jandrese 2622 days ago
Sure, can you whip up an easy 3 column layout for me using the parts of CSS that are fully standardized?

CSS does a lot of things really well, but makes some common tasks way more difficult than they need to be.

2 comments

<table>

  <tr>

    <td></td>
    <td></td>
    <td></td>

  </tr>
</table>

Sorry, I couldn't resist

<style> table td {width:33.3333%;float:left;padding:10px;box-sizing:border-box;margin:0;display:block;border: none;border-collapse: inherit;border-spacing: 0;} table {width:100%} </style>

lol

This is pretty contrived but it took less than 10 minutes and required 0 googling:

https://jsbin.com/nedesuvozo/edit?html,output

The important two css classes:

    .Example--outer-container {
      display: flex;
      flex-direction: row;
    }
    
    .Example-three-column-inner-container {
      width: 33.333%;
    }
Browser support: https://caniuse.com/#feat=flexbox