2010-02-27 4 views
3

Когда промежуток вложен в div с другим фоном, есть небольшой зазор над и под ним. FF этого не делает.Хром не отображает промежуток в div правильно

Вот HTML:

<html> 
<body> 
    <div style="background-color:magenta"> 
    <span style="background-color:cyan">Nested</span> 
    </div> 
    <div style="background-color:cyan">Can you see that magenta line ?</div> 
</body> 
</html> 

ли кто испытал это?

Спасибо PS: Я бег хром 5.0.307.9 беты под Xubuntu 9.10

+1

Просто потому, что FF делает это один из способов, не означает, что это правильный путь. Боже мой, посмотри в IE! Они сделали очень много, что-то не так, за что ... Более 10 лет? Люди считали этот стандарт очень долгое время. (Это были темные времена Интернета.) Предоставленный FF не приближается к IE, но все же. Все читают правила по-разному, вы должны переопределить каждое свойство css так, как вы ожидаете, чтобы ваша среда соответствовала между браузерами. Если у вас есть вопрос, перейдите к W3C и посмотрите, что это ДОЛЖНО быть. –

ответ

7

Проблемы по умолчанию line-height. Браузеры различаются в зависимости от того, как они определяют высоту линии по умолчанию («нормальный»), но многие делают ее более чем на 1 м (высота по умолчанию для диапазона). Попробуйте явно устанавливая высоту строки в 1em:

<span style="background-color:cyan;line-height:1em;">Nested</span> 

или

<div style="background-color:magenta;line-height:1em;"> 

Если вы хотите использовать линию высоты больше, чем 1em, вам необходимо отметить срок display:inline-block для того, чтобы позволяют его цвет фона, чтобы заполнить высоту строки, а не только 1em пролета инлайн:

<div style="background-color:magenta;line-height:2em;"> 
    <span style="background-color:cyan;display:inline-block;">Nested</span> 
</div> 
+0

Одна из плохих вещей, которые сделал W3C. Практически все остается в стороне от интерпретации их стандарта, и для всех не предоставляется никакого значения. Я рад видеть, что W3C настраивает укусы прямо с HTML5 и фиксирует некоторые из их основных проблем со стандартом в целом. –

+0

Это именно то, что я искал! Спасибо большое :) – Bruno

Смежные вопросы