Почему фон на элементе сечения не отображается (высота 0)?

Question

я заметил, что в следующем примере обратите внимание на классы, я использую 960gs на случай, если классы css вмешались

html

<section id="main" class="container_12">
  <div class="grid_12">
    <article>
    ...

css

header, footer, section, article, nav, aside { display: block; }
#main { background: #fff; }

я заметил, что #main имеет height 0 в firebug.также, если я делаю

#main .grid_12 { background: #fff; } 

, он работает

, я заметил, что если я использую div вместо section, css работает

UPDATE

оказывается, что из-за div.grid_12, а точнее div.grid_x, который вызывает проблему, если я уберу это <div>, это будет работать, даже если я использую <section>

<section id="main" class="container_12">
  <div class="grid_10"> <!-- <<< this div -->

Answer 1

Из спецификации :

Элемент section не является общим элементом контейнера. Когда элемент нужен для стилизации или для удобства написания сценариев, авторам рекомендуется вместо этого использовать элемент div. Общее правило заключается в том, что элемент section уместен только в том случае, если содержимое элемента будет явно указано в схеме документа.

Answer 2

я нашел ответ, grid_x имеет float: left мне нужно очистить его