Испытание 27/32

Мое решение. Не знаю правильно ли, ну как понял.

<!DOCTYPE html>
<html lang="ru">
  <head>
    <title>Испытание: строим сетку</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
   <div class="raw clearfix">
      <div class="header layout-column">Header</div>
      <div class="menu">
       <div class="centr-menu layout-column">
       Menu
      </div>
      </div>
      <div class="promo layout-column">Promo 1</div>
      <div class="promo layout-column">Promo 2</div>
   </div>
   <div class="main clearfix">
      <div class="left layout-column">Left</div>
      <div class="centr layout-column">Main</div>
      <div class="layout-column">Right</div> 
   </div>
   <div class="footer clearfix">
        <div class="layout-column">Footer</div>
   </div>
  </body>
</html>


body {
  width: 450px;
  height: 335px;

  font-size: 10px;
  font-family: "Arial", sans-serif;
  color: white;
}

.raw {
  background-color: #34495e;
  min-height: 170px;
  }
  .header {
    background-color:#c0392b;
    float: left;
    width:350px;
    min-height:35px;
    margin: 10px 50px;
    }
    
  .menu {
    background-color:#3498db;
    clear:both;
    min-height: 35px;
    }
    
  .centr-menu {
    width:350px;
    min-height: inherit;
    margin: auto;
    }
      
  .promo {
    background-color:#c0392b;
    float:left;
    width:170px;
    min-height: 60px;
    margin: 10px;
    margin-left: 50px;
    }
    
  .promo:last-child {
    float:right;
    margin-right: 50px;
    margin-left: 0px;
    }
    
.man {
  min-height: 130px;
  }
  .main .layout-column{
    background-color:#3498db;
    float:left;
    min-height: 110px;
    width: 70px;
    margin: 10px 5px;
    }
  .main .left{
    margin-left: 50px;
    }
  .main .centr{
    width: 190px;
    }
 
.footer {
  background-color: #34495e;
  min-height: 35px;
  }
  .footer .layout-column {
    float: left;
    width: 350px;
    height: 35px;
    margin: 0 50px;
    }

.layout-column{
  padding: 5px;
  box-sizing:border-box;
  }
  
.clearfix::after { 
  content: "";
  display: table;
  clear: both;
  }