Вид для печати
Возникла необходимость добавить в блок #content {width: 100%; padding: 0 10px;}. Но в голове постоянно крутится что использовать padding в dive плохо. Скажите чем может аукнуться использование паддинга.
P.S. мозг от матчасти обезвожен. Сагалаев Сила !:]
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 08:46
Возникла необходимость добавить в блок #content {width: 100%; padding: 0 10px;}.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Именно так – нельзя... Потому что ширина блока получится 100%+10px+10px. Т.е. блок будет больше ширины экрана и появится перманентный горизонтальный скролл вне зависимости от ширины окна браузера...
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 08:46
Но в голове постоянно крутится что использовать padding в dive плохо.
Скажите чем может аукнуться использование паддинга.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Глупости. При выборе метода создания отступов необходимо руководствоваться следующим:
– отступы [padding] находятся внутри рамки элемента, и на них распространяется фон элемента
– поля [margin] находятся за рамкой элемента, и они совершенно прозрачные
Если же у элемента нет ни фона, ни рамки, никакой разницы между выбором padding или margin нет.
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 08:46
P.S. мозг от матчасти обезвожен. Сагалаев Сила !:]
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Да, Иван Григорьевич рулит...)
Можно на примере показать ?Цитата:
Originally posted by Aykroyd@Jun 19 2007, 06:50
[b]Глупости. При выборе метода создания отступов необходимо руководствоваться следующим:
– отступы [padding] находятся внутри рамки элемента, и на них распространяется фон элемента
Код:<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<style><!--
* {margin:0; padding:0;}
#main {width: 100%; height: 300px; background-color: red; padding: 0 20px;}
--></style>
</head>
<body>
<div id="main"></div>
</body>
</html>
Что показать?
Как сделать чтобы не было 100%+20px+20px а было 100%+0px+0px в коде что я разместил в топике.Цитата:
Originally posted by Aykroyd@Jun 19 2007, 13:38
[b]Что показать?
И ещё вопрос, под рамкой подразумевается border или я пока не допонимаю?
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 18:49
Как сделать чтобы не было 100%+20px+20px а было 100%+0px+0px в коде что я разместил в топике.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Чтобы было 100%+0px+0px надо убрать padding: 0 20px;
Честно говоря, я уже утомился объяснять, что нельзя задавать боковые маргины или паддинги в совокупности со 100%-ной шириной...
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 18:49
И ещё вопрос, под рамкой подразумевается border или я пока не допонимаю?
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Да. Бордер.
Вобщем разобрался вроде. Если у контейнера указана какая либо ширина то применяя к нему правило margin или padding требуется учитывать что значение этих правил добавится к размеру контейнера. Поэтому если требуется сделать отступ как внешний так и внутренний в контейнер с указанной шириной требуется разместить другой контейнер в котором не указана ширина и тогда можно применять padding, margin.
Аминь.
Кто нибудь может объяснить что я написал ? :]Цитата:
Originally posted by Aykroyd@Jun 19 2007, 16:54
[b]Аминь.
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 21:48
Вобщем разобрался вроде. Если у контейнера указана какая либо ширина то применяя к нему правило margin или padding требуется учитывать что значение этих правил добавится к размеру контейнера. Поэтому если требуется сделать отступ как внешний так и внутренний в контейнер с указанной шириной требуется разместить другой контейнер в котором не указана ширина и тогда можно применять padding, margin.
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
Давай зачотко... Пядь...
Только не забывай, что для элементов, которые находятся в прямом потоке, совсем не обязательно указывать ширину в 100%. Потому что они и так занимают эти 100%... по умолчанию... И им можно спокойно добавлять боковые отступы и поля...
Этого нельзя сказать про абсолютно спозиционированные элементы и элементы, к которым применено свойство float. И вот для них-то как раз и приходится частенько использовать width: 100%... Ну и соответственно отступы и поля боковые уже задавать не им, а их дочерним блокам...
[/quote]Цитата:
Originally posted by Рёга@Jun 19 2007, 15:49
Как сделать чтобы не было 100%+20px+20px а было 100%+0px+0px в коде что я разместил в топике.
И ещё вопрос, под рамкой подразумевается border или я пока не допонимаю?
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]
все мы с надеждой ждем, что когда-нить будет возможно что-нить такое
[Only registered and activated users can see links. Click Here To Register...]Код:#mainContent {
width: calc(100% - 200px)
}