Xiper

Обнуление отступов

Автор: Евгений Рыжков Дата публикации:

Каждый браузер имеет свои начальные значения стилей, в частности значения отступов для некотрых элементов (для абзацев, списков, форм и т.д.). Пример: отображение <p> по умолчанию:

Firefox имеет начально установленные отступы для абзацевFirefox имеет начально установленные отступы для абзацев Высота блока 1px в ИЕ6а ИЕ6 нет

Для установки нулевых значений отступов для всех элементов и для всех браузеров в начале CSS-файла используем:

* {
margin: 0;
padding: 0;
}

* — универсальный селектор, который сообщает, что данное правило предназначено для всех элементов.

Преимущества:

  • простота
  • сокращение кода CSS

Недостатки:

  • не охватывает все возможные свойства, которые нужно сбросить
  • в Mozilla для select появляется небольшой баг
  • не сбрасывает padding для input
  • в некоторых браузерах оформление кнопок по умолчанию теряет свой вид (выглядят как текст с рамкой вокруг, например в Opera)
  • несколько замедляет рендеринг (отображение) страницы в Mozilla (актуально для крупных файлов css в тысячи строк кода. В других случаях эта задержка незаметна, исчисляется мкс)

Более продвинутый подход — использование сброса стилей всех необходимых элементов (установка нужных значений) без использования универсального селектора.

По теме