Спонтанное увеличение высоты h3

[Ge1i0N]

Есть вёрстка, вроде бы всё нормально в ней, но есть один ньюанс.

Есть два одинаковых блока, со вторым всё нормально, а вот в первом блоке h3 непонятно почему увеличивается по высоте, из-за чего немножко всё едет.

Если блоки поменять местами, то тогда во втором блоке всё едет, а первый отображается корректно.

Уж не знаю на что и думать.

Сама вёрстка тут: http://jsfiddle.net/kAf3a/

Вот эти два блока должны быть одинаковыми:

Edited October 13, 2013 by Ge1i0N

[lexxcode]

Там у #menu установлен float: left; нарушается нормальный поток и соответственно nav который оборачивает этот список схлопывается, а дальше уже вся эта веселуха происходит. В общем float применяете там где это совсем не нужно

[Ge1i0N]

Там у #menu установлен float: left; нарушается нормальный поток

Да, действительно помогло.

Вроде бы мелочь, а такое творит...

Хотя по мне-не совсем логичное поведение, даже не смотря на float.

[Catherine]

Хотя по мне-не совсем логичное поведение, даже не смотря на float.

Совершенно логичное поведение, связанное именно с наличием float. В этой статье довольно подробно расписан принцип работы float. Одна из особенностей работы:

3. Следующие за ним блочные боксы подтягиваются вверх и занимают его место, как если бы float'нутого бокса в потоке не было.

Конкретно в вашем случае блок .action подтянулся вверх. Если посмотреть в инспекторе, то видно, что он начинается на одном уровне с #menu. Это потому, что #menu должен обтекаться с правой стороны, но из-за отсутствия свободного места справа содержимое блока .action может разместиться только под обтекаемым блоком. Вот немного измененный пример для демонстрации логики поведения в данном случае.