Сетка.Где ошибка?Почему не получается отцентровать Features?

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

Выделяю border блоки, чтобы очертить центрование, по типу как описано в заданиях.Пытаюсь отцентровать, все блоки но почему-то не работает margin:0 auto;
В то время как тут центровщик работает:Последняя сетка, шаг 2 — Сетки — HTML Academy
(.layout-positioner {
width: 430px;
margin: 0 auto;})

Спасибо!
Вот Код:
> 

<html lang="ru">
    <head>
       <title>Сетка посложнее, добавляем содержание</title>
       <meta charset="utf-8">
       <link href="//fonts.googleapis.com/css?family=PT+Sans:400&subset=cyrillic" rel="stylesheet" type="text/css">
    </head>
    <body>
    <div class="clearfix header">
    <div class="position">
     <div class="logo">
     <img src="/themes/htmlacademy/img/logo.png" width="150px">
     <p>Научитесь создавать современные веб-интерфейсы, оттачивайте своё мастерство, станьте настоящим профессионалом.</p>
     </div>
     <div class="menu">
     <ul>
     <li>Курсы</li>
     <li>Интенсив</li>
     </ul>
     </div>
     </div>
     </div>
     <div class=" clearfix features">
    <div class="position">
     <div class="block column1">Вы научитесь создавать современные веб-интерфейсы, работать с живым кодом, использовать новейшие технологии.</div>
     <div class="block column2">Минимум скучной теории и максимум практических упражнений, решение реальных задач и настоящие испытания.</div>
     <div class="block column3">Интересные, наглядные и затягивающие курсы, интерактивные интерфейсы, достижения — всё для обучения с удовольствием.</div>
     </div>
    </div>
     <div class=" clearfix block footer">
         <div class="position">
     <div class="flogo"><img src="/themes/htmlacademy/img/logo.png" width="150px"></div>
     
     </div>
     </div>
    </body>
</html>

CSS:
body {
min-width: 500px;
margin: 0;
padding: 0;
font-family: “PT Sans”, sans-serif;
}

.clearfix::after {
display: table;
content: “”;
clear: both;
}

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

.layout-positioner::after {
display: table;
content: “”;
clear: both;
}

.header {
margin-bottom: 10px;
color: white;
background: #34495e;
}

.header .layout-column {
min-height: 50px;
background: rgba(192, 57, 43, 0.9);
}

.header .layout-column-1 {
float: left;
width: 280px;
}

.header .layout-column-2 {
float: right;
width: 130px;
}

.features {
margin-bottom: 10px;
}

.features .layout-column {
float: left;
width: 130px;
min-height: 100px;
margin-right: 20px;
background: rgba(236, 240, 241, 0.9);
}

.features .layout-column:last-child {
margin-right: 0px;
}

.footer {
min-height: 50px;
color: white;
background: #34495e;
}

2

Непонятно: какое Вы задание делаете? Что-то из промежуточных или финальное испытание?

3

Воспользуйтесь песочницей для своих экспериментов. Или хотя бы укажите номер задания, которое используете для примера.