2Column

by Annett

HTML

<div class="grid">
  <div class="col-2-3">
     Main Content
  </div>
  <div class="col-1-3">
     Sidebar
  </div>
</div>

CSS

.grid {
background: #f3f3f3;}

.grid:after {
  content: "";
  display: table;
  clear: both;
}

.col-2-3 {
  width: 66.66%;
    background: red;
}
.col-1-3 {
  width: 33.33%;
  background: blue;  
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

[class*='col-'] {
  padding-right: 20px;
}
[class*='col-']:last-of-type {
  padding-right: 0;
}

[class*='col-'] {
  float: left;
}