Испытание: строим сетку [27/32] Нужны советы

Курсы §15. Сетки
1

Вообще нужна доскональная критика, но в приоритете следующие вопросы:

  1. Можно ли улучшить данный код? как ? (результат и образец совпали )
  2. Как грамотно добавить текст ? сss правило и его положение

Код HTML

<body>
    <div class="header">
        <div class="layout-positioner">
            <div class="header_top">
            </div>
        </div>
        <div class="header_menu">     
        </div>
        <div class="layout-positioner">
            <div class="header_promo header_promo_1">
            </div>
            <div class="header_promo header_promo_2">
                
            </div>
        </div>    
    </div>
    <div class="middle">
        <div class="layout-positioner">
            <div class="main main_left">
            </div>
            <div class="main main_center">
            </div>
            <div class="main main_right">
            </div>
        </div>
    </div>
    <div class="footer">
        <div class="layout-positioner">
            <div class="footer_block">
            </div>
        </div>
    </div>
   <!-- 
    Left
    Main
    Right
    Footer-->
</body>
СSS: html, body { margin: 0; padding: 0; } body { width: 450px; height: 335px; font-family: "Arial", sans-serif; font-size: 10px; color: white; } .header { background: #34495e; margin-bottom: 10px;

}
.layout-positioner {
width: 350px;
margin: 0 auto;
/* border: 2px dashed #3498db;*/
}

.layout-positioner::after {
display: table;
content: “”;
clear: both;
}
.header_top {
background: #c0392b;
height: 35px;
float: left;
width: 350px;
margin-top: 10px
}
.header_menu{
margin-top: 10px;
height: 35px;
background: #3498DB;
width: 100%;
}
.header_promo{
height: 60px;
width: 170px;
margin-top: 10px;
margin-bottom: 10px;

background: #c0392b;

}
.header_promo_1{
float: left;
margin-right: 10px;
}
.header_promo_2{
float: right;
}
.middle{
margin-bottom: 10px;

}
.main{
height: 110px;
background: #3498DB;
float: left;
}
.main_left{
width: 70px;
margin-right: 10px;
}
.main_center{
width: 190px;
margin-right: 10px;
}
.main_right{
width: 70px;
}
.footer{
background: #34495e;
}
.footer_block{
width: 100%;
height: 45px;
}
/*
Используемые цвета:
#34495e – мокрый асфальт
#c0392b – красный
#3498DB – синий
*/

2

Текст нужно обернуть в span или параграф и задать внутренние отступы.
Касательно замечаний почитайте сегодняшние темы по этому заданию: http://forum.academy/c/kursy/15-setki

3

спасибо, почитал вроде разобрался