Я создал этот надуманный пример, чтобы проиллюстрировать мою проблему. Есть два абзаца с div между ними. Высота div и line-height были установлены на 0, а все поля также равны 0. Я ожидаю, что два абзаца будут находиться рядом друг с другом без какого-либо отступа от div, однако в IE6 это не так , Кажется, он отлично работает во всех других браузерах.
Вот HTML-код со всеми встроенными стилями:
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Test</title>
</head>
<body>
<div id="container" style="border: 1px solid blue;">
<p style="margin: 0;">
Some text
</p>
<div style="height: 0; line-height: 0; margin: 0; border: 1px solid red;">
</div>
<p style="margin: 0; border: 1px solid green">
Should be right below "Some text"
</p>
</div>
</body>
</html>
Я добавил несколько рамок, чтобы вам было легче видеть, что происходит.
Вот скриншот того, что происходит в IE6:
Есть идеи, как мне избавиться от этого небольшого пространства между нижней частью div (красный) и верхней частью абзаца (зеленый)?