В чем причина заполнения/поля?

Я был impementing веб-страницы в HTML, и я столкнулся с странной проблемой.В чем причина заполнения/поля?

#menuh 
    { 
    width:100%; 
    padding-top:10px; 
    padding-bottom:10px; 
    float:left; 
    font-family:arial, tahoma; 
    text-align:left; 
    padding-left:12%; 
    background:#c1188d; 
    }

Я ничего не вижу здесь, который должен ввести белый край на левой стороне.

Пустой пурпурный пояс для выпадающего меню должен быть выровнен строго налево (по моему мнению), но это не так. (левая сторона должна быть похожа на правую сторону на правый край.)

Может ли кто-нибудь сказать мне, что такое расстояние между краем браузера и пурпурный div (#menuh)?

источник

2013-05-03 Hayri Uğur Koltuk

название Вопрос не соответствует вопрос. – BoltClock

@BoltClock, почему вы так думаете, и каково ваше предложение? –

В большинстве браузеров существуют стили по умолчанию. В моем случае (Chrome/Mac) элемент body имеет наложенный на него размер 8px. Вы можете использовать следующее правило (положить его в верхней части CSS), чтобы удалить все маржу/отступы по элементам по умолчанию:

* { margin: 0; padding: 0 }

Или вы можете просто удалить маржу/отступы на body элемента. Я предпочитаю метод подстановочных знаков, так как он не позволяет одной и той же проблеме появляться позже с другими настройками браузера.

источник

2013-05-03 18:39:00

Чтобы добавить к этому ответу, большинство опытных разработчиков веб-интерфейса используют так называемый сброс CSS, чтобы удалить поведение браузера по умолчанию, прежде чем применять свои собственные стили CSS. Я бы настоятельно рекомендовал посмотреть на сброс CSS, так как это может сделать вашу жизнь намного проще, особенно для кросс-браузерной разработки. –

На самом деле, у большинства опытных разработчиков веб-интерфейса нет. – BoltClock

Я соглашаюсь с BoltClock здесь – Bojangles

JSFiddle (и большинство браузеров) присваивает тегу <body> по умолчанию, которое представляет собой пробел, который вы видите. Комплект

body { 
    padding: 0; 
}

и ваша проблема уходит. Прокладка в вашем JSFiddle (для меня по крайней мере на Chrome/Win8) составляет 8 пикселей.

Поймать все ситуации (браузеры имеют разные стили по умолчанию), примените 0 отступы и запас как к <body> и <html>:

html, body { 
    padding: 0; 
    margin: 0; 
}

источник

2013-05-03 18:39:25 Bojangles

По умолчанию обивки является проблемой. У большинства браузеров есть это, поэтому даже вне jsfiddle вы можете столкнуться с этим.

Лучше всего использовать CSS-таблицу стилей сброса CSS. Создает правильное заполнение и сброс полей для большинства элементов, которые вы будете использовать на своей веб-странице. Вот некоторые примеры:

http://yuilibrary.com/yui/docs/cssreset/
http://meyerweb.com/eric/tools/css/reset/
http://www.cssreset.com/
http://html5reset.org/
http://necolas.github.io/normalize.css/

источник

2013-05-03 18:47:31 tahdhaze09

В чем причина заполнения/поля?

ответ

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