Автор Linux задал вопрос в разделе Верстка, CSS, HTML, SVG
Как сделать padding: 10px; так чтобы div не увеличился в размере ? и получил лучший ответ
Ответ от
Добавь div{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100; height:100; padding:10px;}
Ответ от Игорь Сердитый[эксперт]
Чтобы внутренние отступы (padding) не учитывались в размере элемента, для него следует установить следующий стиль:
box-sizing: border-box;
Чтобы внутренние отступы (padding) не учитывались в размере элемента, для него следует установить следующий стиль:
box-sizing: border-box;
Ответ от FARAON[новичек]
Можно и другим способом:
div id="block" это родительский блок, при добавлений padding:20px; его размер увеличится.
div class="content"
добавив этот дочерний блок и прописать в нем свойство padding:20px;
(тогда у нас родительский блок не потеряет свои размеры и останется не затронутым)
а блок в котором находится свойство padding растянется по width родительского
(а вот по height он не растянется а ограничится отступом, и нужно будет указывать height если же оно вам нужно)
/div
/div
Вот стили для примера:
style
див#block{
width:100px;
height:100px;
}
див. content{
padding:20px;
/******height:60px;**размер конечно же с учетом отступа с верху и с низу у нас в данном случае это 40px***/
}
/style
Можно и другим способом:
div id="block" это родительский блок, при добавлений padding:20px; его размер увеличится.
div class="content"
добавив этот дочерний блок и прописать в нем свойство padding:20px;
(тогда у нас родительский блок не потеряет свои размеры и останется не затронутым)
а блок в котором находится свойство padding растянется по width родительского
(а вот по height он не растянется а ограничится отступом, и нужно будет указывать height если же оно вам нужно)
/div
/div
Вот стили для примера:
style
див#block{
width:100px;
height:100px;
}
див. content{
padding:20px;
/******height:60px;**размер конечно же с учетом отступа с верху и с низу у нас в данном случае это 40px***/
}
/style
Ответ от 22 ответа[гуру]
Привет! Вот подборка тем с похожими вопросами и ответами на Ваш вопрос: Как сделать padding: 10px; так чтобы div не увеличился в размере ?