есть радителски див таг, в нём есть дочерни див, хочу что дочерни див било би в центре радителского (по горизонтале), сделаю ето так, через атрибута алигн
<div id="parent" align="center" style="width: 100%;">
<div id="childre" style="width: 100px; height: 100px; background-color: #090">
</div>
</div>
вопрос, а как можно сделат ето без атрибута алигн, на чистом css-е ?
Спустя 19 минут, 25 секунд (24.06.2012 - 01:16) l@pteff написал(а):
для отдельно взятого div'a можно просто так сделать
а для выравнивания текста юзать css
<div id="parent" style="width: 100%; text-align:center">
<center><div id="childre" style="width: 100px; height: 100px; background-color: #090"></center>
а для выравнивания текста юзать css
<div id="parent" style="width: 100%; text-align:center">
Спустя 25 минут, 43 секунды (24.06.2012 - 01:42) SoMeOnE написал(а):
<div id="parent" style="width: 100%; border:1px solid; padding: 5px;">
<div id="childre" style="border:1px solid; position: relative; left:50%; width: 100px; margin-right:50px">
zcsdfasds
</div>
</div>
Техника такая классическая. Должно сработать.
Спустя 5 минут, 41 секунда (24.06.2012 - 01:47) rooor написал(а):
margin: 0 auto; ?
Спустя 54 секунды (24.06.2012 - 01:48) SoMeOnE написал(а):
Еще можно так. Что т опервый вариант не очеь рабоатет. Не вижу где ошибка. margin-right:50px что то не срабатывает.
<div id="parent" style="width: 100%; border:1px solid; padding: 5px;">
<div id="childre" style="border:1px solid; width: 100px; margin: 0 auto;">
zcsdfasds
</div>
</div>
Спустя 6 минут, 43 секунды (24.06.2012 - 01:55) SoMeOnE написал(а):
Но все таки классическая схема, когда мы даже не зная ширину родительского дива можем поставить по центру это вот так
<div style="border: 1px solid; padding: 5px;" id="parent">
<div style="border: 1px solid; left: 50%; width: 100px; position: relative; margin-left: -50px;" id="childre">
zcsdfasds
</div>
</div>
Спустя 6 дней, 10 часов, 19 минут, 52 секунды (30.06.2012 - 12:15) Гость_Shkiper написал(а):
Короче в радительский падежь в стили допиши
text-align:center
Спустя 17 минут, 26 секунд (30.06.2012 - 12:32) sergeiss написал(а):
Цитата (dadli @ 24.06.2012 - 01:56) |
вопрос, а как можно сделат ето без атрибута алигн, на чистом css-е ? |
Как вариант, задать еще один ДИВ, дополнительный контейнер. Для него задаем положение 50% - это проценты относительно родительского ДИВа, т.е. от ширины экрана. И задаем ширину этого дива. А во вложенном ДИВе, который уже основной для показа, задаем margin-left:-50%, уже в процентах от размера "первого ребенка". В итоговом ДИВе размеры задаем в процентах.
<div id="parent" style="width: 100%;">
<div id="first_children" style="position:relative; left:50%; width:100px; height:100px">
<div id="childre" style="width: 100%; height: 100%; background-color: #090; margin-left:-50%;">
</div>
</div>
</div>
Похоже на то, что предлагал SoMeOnE, но мы можем спокойно задавать разные размеры. Положение будет меняться автоматически, т.е. не надо задавать margin в пикселях.
В итоге получаем универсальную хрень, которая должна работать не только с ДИВами, и уж точно никак не привязана ни к каким выравниваниями текстов, как тут предлагалось.
PS. Подредактировал, убрал "position:relative;" у внутреннего ДИВа.
_____________
когда чарли чаплин принимал участие в конкурсе: "клон чарли чаплинов", то чарли занимал третю позицию.