Как создать div высотой 1 пиксель в IE8

У меня есть следующий код для создания линии высоты 1px:

<div style="width:300px; height:1px; background-color:#ff3300; margin-top: -1px;"></div> <!-- top red line -->

Код отлично работает в Firefox, однако в IE8 он отображается в виде строки высотой 10 пикселей или около того. Как я могу заставить IE учитывать указанную высоту?

Редактировать:

  • Я просто попытался установить min-height свойство до 1px, но это тоже не сработало.
  • max-height IE тоже игнорируется
  • Настройка line-height до 1 не помогает

Почему IE игнорирует все мои правила CSS?

5 ответов

Решение

Просто установите размер шрифта в 1px; IE ограничивает высоту этого div размером шрифта.

@ Laurent, если вы все еще не можете получить желаемый 1px div, несмотря на использование height:1px; line-height:1px; шрифт: обычный 1px/1px arial; вам может потребоваться проверить ваше DTD (определение типа документа) в верхней части кода вашей веб-страницы. Вы можете попробовать это:

<!DOCTYPE HTML>
<html>
...
</html>

Задавать line-height а также font-size до 1px.

Мое предложение: это проблема с полосой прокрутки браузера. Просто положите тело {поле:0; padding:0;} вы не можете видеть строку во всех браузерах.

Стрелка вверх полосы прокрутки IE7, помещающая эту строку.

Без контекста действительно трудно сказать... кроме сброса отступа до 0, это может иметь отношение к другим элементам (возможно, выше). Особенно, если они плавают. Может также попытаться прояснить: оба; Также убедитесь, что он не имеет дисплея: встроенный; в любом месте... Это блок по умолчанию, и должен быть блоком.

Это действительно тыкает в темноте без контекста.

Другие вопросы по тегам