Equal width columns

equal-width-columns.html

<style>
body { margin: 0; padding: 0}
#container {
    position: absolute;
    top: 30px; left: 50px;
    bottom: 30px; right: 50px;
    border: 1px solid #ccc
}

#container > div {
    width: 33.3333333%;
    height: 100%;
    float: left;
}
#container div div {
    height:100%;
}
#container div div.a {
    background: red; margin-right: 7px
}
#container div div.b {
    background: green; margin:0 8px;
}
#container div div.c {
    background: blue; margin-left: 7px
}
</style>

<div id="container">
  <div><div class="a">First</div></div>
  <div><div class="b">Second</div></div>
  <div><div class="c">Third</div></div>
</div>