Css:Центрирование блочного элемента

Тема: Css:Центрирование блочного элемента

цитата
22/10/09 в 20:36

erobrand
привет, хочется спросить, кто как центрирует блочные элементы, width которых чётко не задана и может менятся? я это делаю с некоторым извратом, вдруг есть способы проще. Наспамьте решения, которые юзаете вы.

Оффтопик: Не надо писать ерунды, если вы не в теме, но "думаете" что сработает.

Последний раз редактировалось: erobrand (22/10/09 в 21:03), всего редактировалось 1 раз

цитата
22/10/09 в 20:53

Mika
margin: 0 auto;
Или я не понял вопроса. И что в данном случае есть "длина"? Я всегда считал, что там только ширина (width) и высота (height).

Последний раз редактировалось: Mika (22/10/09 в 21:21), всего редактировалось 1 раз

цитата
22/10/09 в 21:02

erobrand
длина=ширина

есть варианты?)

цитата
22/10/09 в 21:11

Monty Python
text-align: center; на отцовский див, нет?

цитата
22/10/09 в 21:23

erobrand

Нет!

Я прошу решения для блочного элемента. Читайте внимательнее

цитата
22/10/09 в 22:02

Skat
ну можно поиграться с min и max width или же заюзать отступы чтобы например центр от боков экрана на фикс расстояние например на расстояние сайдбара (сайдбаров)

можно еще через display:inline-block

цитата
22/10/09 в 22:46

erobrand
Skat писал:

ну можно поиграться с min и max width или же заюзать отступы чтобы например центр от боков экрана на фикс расстояние например на расстояние сайдбара (сайдбаров)

можно еще через display:inline-block

а по подробнее можно? мин-мах можно - но не очень будет..по сотальным вариантам не понял, что ты имел в виду.

цитата
22/10/09 в 23:10

Yacc
Код:

<html>
<style>
#container
{
float:left;
left:50%;
position:relative;
}
#content
{
left:-50%;
position:relative;
height:150px;
border:1px dotted red;
}
</style>
<body>
<div id="container">
<div id="content">
1234567890-abcdefg
</div>
</div>
</body>
</html>

цитата
22/10/09 в 23:45

erobrand
Yacc: лови +6

ещё хочу

цитата
22/10/09 в 23:53

Yacc
Чего хочешь-то?

Ну, вот тебе ещё.
Для неправильного браузера №8:

Код:

#content
{
left:-50%;
position:relative;
display:inline;
height:150px;
border:1px dotted red;
}

Для изображений пойдёт.

цитата
23/10/09 в 11:34

erobrand
кстати по поводу неправильных браузеров - твой предыдущий я ещё для ИЕ6 2 строчки вбил

спасибо, оценил.

цитата
23/10/09 в 13:59

hardy
Yacc: отличное решение!
я обычно юзаю другой способ, меньше на 1 div, но с экспрешном для ие6.

Код:

<html>
<style>
#container
{
display:table;
margin:0 auto;
border:1px dotted red;
}
* html #container {
float: left;
display: inline;
margin-left: expression(((this.parentNode.offsetWidth - this.offsetWidth) / 2) + "px");
}
</style>
<body>
<div id="container">
1234567890-abcdefg
</div>
</body>
</html>

цитата
23/10/09 в 15:26

erobrand
лови +6 в репу

Здорово

Новая тема Ответить

Эта страница в полной версии