Example

by LuckyCat

HTML

<div class="content_left" style="float: left; background:#F5DC09;">
            <div class="" style="font-size: 36px;float:left;line-height: 33px;">1</div>
            <div style="float:left;">
                <div class="" style="font-size: 17px;text-transform: uppercase;">month</div>
                <div class="" style="font-size: 10px;text-transform: uppercase;">membership</div>
            </div>
        </div>

        <div class="content_right" style="float: right; text-align: right;background:#E73D00;">
            <div class="" style="display: inline-block;">
                <div style="font-size: 36px;">£1</div>
            </div>
            <div class="" style="display: inline-block; margin-left: 10px;">
                <a href="#" class="button_common width100">Get offer</a>
            </div>
        </div>

        <div class="content_center" style="background:#91CA00;">
            <div class="" style="font-size: 12px;text-align: center;">for</div>
        </div>

<div style="clear:both; height: 100px;"></div>
<div class="container">
 <div class="nav">
  Левая колонка
 </div>
 <div class="content">
  Контент
 </div>
</div>
<div class="sidebar">
 Правая колонка
</div>

CSS

.container {
 float:left; /* Делаем контейнер плавающим, чтобы добиться нужного поведения */
 width:100%; /* Указываем контейнеру занимать все доступное пространство */
 margin:10px -170px 10px 0; /* Устанавливаем отрицательное правое поле, чтобы подтянуть правую колонку */
}
.nav {
 float:left; /* Прижимаем блок налево */
 width:150px; /* Обращаем внимание, что фактическая ширина блока = 170 пикселям */
 padding:10px;
 background:#E73D00;
}
.content {
 margin:0 150px 0 170px; /* Устанавливаем поля, чтобы контент не «налезал» на боковые колонки */
 padding:10px;
 background:#91CA00;
    text-align: center;
}
.sidebar {
 float:right; /* Прижимаем блок направо */
 width:130px; /* Обращаем внимание, что фактическая ширина блока = 150 пикселям */
 margin-top:10px;
 padding:10px;
 background:#F5DC09;
}