Причудливое поведение с пометкой Firefox css

Question

Что-то странное происходит с настройкой поля в Firefox, у меня есть div с идентификатором «wrap» с верхним краем 20px, когда пользователь регистрируется в div, появляется над разделителем div с id user_nav Я не хочу, чтобы какой-либо запас над этим div, но Firefox для какого-то неизвестного reaslon, распространяющего верхнее поле, которое у меня есть на обертке div, над надписью user_nav над ним, это не происходит ни в каких других браузерах.

Если я удаляю верхнее поле из оберточного div, он удаляется из обоих.

Я могу избавиться от него, предоставив user_nav div отрицательное верхнее поле, но это испортило все другие браузеры.

div#user_nav { 
width: 980px; 
margin: 0 auto; 
} 


div#wrap { 
width: 980px; 
margin: 20px auto 30px auto; 
} 

Любые идеи о том, что происходит?

Благодаря

Роб Фенвик

Answer 1

Это действительно изворотливый поведение - и это, кажется, один из эффектов этой старой ошибки, связанные с очистки блоков элементов (или один из его много, много дублей):

https://bugzilla.mozilla.org/show_bug.cgi?id=451791

Один из способов обойти это избавляется от <div class="clear"> и используя метод перелива клиринговых вместо (хотя это не непрестанно s возможно, например. - очевидно, - если у вас есть содержимое внутри очищенную элемента, который будет распространяться за его пределами):

http://www.quirksmode.org/css/clearing.html

Ie, удалить <div class="clear"> изнутри user_nav_frame и применять overflow: hidden (и width: 100%) к нему в CSS вместо того, чтобы очистить поплавки:

div#user_nav_frame { 
    background-color: #0A4D84; 
    overflow: hidden; 
    width: 100%; 
} 

JSFiddle: http://jsfiddle.net/69aD9/2/

Есть контр-писаки тоже, если это не будет работать в вашем случае , См. Приведенный выше отчет об ошибке.