Хочу представить свой вариант, который возможно покажется слишком простым или недоделанным, но именно простота и нативность в нём мне нравится. Здесь использованы совмещенные стили с человеко-читабельными названиями, никакого космоса и никаких вложенностей. Немного “отзывчивости” на маленькие экраны мобильников – бесплатный бонус трек.

CSS:

.columns { float: left; padding-right: 1%;}
.three.columns { width: 32%; }
.three.columns.double { width: 64%; }
.two.columns { width: 49%; }
.clear.columns { clear: both; width: 100%; display: block; }
@media only screen and (max-width: 800px) {
  .columns { float: none; padding-right: 0; width: 100%; }
}

HTML:

<div class="two columns">Первая колонка</div>
<div class="two columns">Вторая колонка</div>
<div class="clear columns"></div>
<div class="three columns">Первая колонка</div>
<div class="three columns">Вторая колонка</div>
<div class="three columns">Третья колонка</div>
<div class="clear columns"></div>
<div class="three columns">Первая колонка</div>
<div class="three columns double">Вторая колонка</div>
<div class="clear columns"></div>

Понравилось? Пользуйся на здоровье. Нет – обоснуй ;)[:]