[27/32] Испытание. Критика

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

Хотелось бы услышать, что можно улучшить, сократить. Заранее спасибо :slightly_smiling_face:

    <header>
  <div class="layout-positioner">
    <div class="header">Header</div>
  </div>
  <div class="header-menu-nav">
    <div class="layout-positioner">
      <div class="header-menu">
        Menu
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="layout-positioner">
      <div class="layout-column">Promo 1</div>
      <div class="layout-column">Promo 2</div>
    </div>
  </div>
</header>
<main>
  <div class="layout-positioner">
    <div class="features">
      <div class="feature">Left</div>
      <div class="feature">Main</div>
      <div class="feature">Right</div>
    </div>
  </div>
</main>
<footer>
  <div class="layout-positioner">
    <div class="footer">Footer</div>
  </div>
</footer>

html,
body {
  margin: 0;
  padding: 0;
}

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

  font-size: 10px;
  font-family: "Arial", sans-serif;
  color: white;
}
header {
  background-color: #34495e;
  margin-bottom: 10px;
  padding-top: 10px;
}
.layout-positioner {
  width: 350px;
  margin: 0 auto;
}
.layout-positioner::after {
  content: "";
  display: table;
  clear: both;
}
.header {
  background-color: #c0392b;
  padding: 5px;
  min-height: 25px;
}
.header-menu-nav {
  margin: 10px 0;
  background: #3498db;
}
.header-menu {
  padding: 5px;
  min-height: 25px;
}
.columns {
  padding-bottom: 10px;
}
.layout-column {
  width: 160px; /* 350 общая ширина минус 20 за padding минус 10 за отступ = 320 / 2=*/
  float: left;
  margin-right: 10px;
  background: #c0392b;
  padding: 5px;
  min-height: 50px;
}
.layout-column:last-child {
  margin-right: 0;
}
.features {
  padding-bottom: 10px;
}
.feature {
  float: left;
  background: #3498db;
  width: 60px;
  min-height: 100px;
  margin-right: 10px;
  padding: 5px;
}
.feature:last-child {
  margin-right: 0;
}
.feature:nth-child(2) {
  width: 180px; /* 350 общая ширина, минус 120 от ширины боковых минус 20 за margin-right, минус padding (30) = 180 */
}
footer {
  margin-top: 10px;
  background: #34495e;
}
.footer {
  padding: 5px;
  min-height: 30px;
}
2 лайка