06.06.2012, 14:25
|
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
|
Сообщение от Nanto
|
|
без заранее заданных размеров
|
размеров чего? блока или его родителя в котором он центрируется? |
|
06.06.2012, 14:31
|
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
Deff,
ну харе говнокодить ламер, он не по центру. увеличь высоту хотя бы на 200 рx
Последний раз редактировалось Seva1986, 06.06.2012 в 14:39.
|
|
06.06.2012, 14:35
|
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
Nanto,
вот, изменил только размеры блоков больше ничего не трогал кроме первого и последнего способа все правильно работают, если не нравяться эмуляции таблиц убери 2 способ и останеться 3 мой любимый
.over3 div{
position:absolute;
margin:auto;
top:0;
bottom:0;
right:0;
left:0;
}
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8"/>
<title>тест</title>
<style>
[class^=over]{
width:400px;
height:300px;
background:green;
border:1px solid red;
}
[class^=over] div{
width:60px;
height:80px;
background:red;
}
.over1{
line-height:200px;
text-align:center;
}
.over1 div{
display:inline-block;
vertical-align:middle;
}
.over2{
display:table-cell;
vertical-align:middle;
}
.over2 div{
margin:0 auto;
}
.over3{
position:relative;
}
.over3 div{
position:absolute;
margin:auto;
top:0;
bottom:0;
right:0;
left:0;
}
.over4{
position:relative;
}
.over4 div{
position:absolute;
margin:-25px 0 0 -25px;
top:50%;
left:50%;
}
</style>
</head>
<body>
<div class="over1">
<div></div>
</div>
<div class="over2">
<div></div>
</div>
<div class="over3">
<div></div>
</div>
<div class="over4">
<div></div>
</div>
</body>
</html>
PS и да, я крутой!
Последний раз редактировалось Seva1986, 06.06.2012 в 14:41.
|
|
06.06.2012, 15:19
|
|
что-то знаю
|
|
Регистрация: 24.05.2009
Сообщений: 5,176
|
|
|
Сообщение от Seva1986
|
|
position:absolute;
|
о да ты крутой, способ прям супер, абсолютная позиция нас всегда спасает, и что потом весь сайт в этом диваке запиливать? говнокод одним словом. Это на квадратике вы крутые, да еще и с абсолютной позицией. А как проект полный написать, дык без заранее известных размеров хрен что сделаете, и не надо доказывать что это не так. Навидался я тру верстальщиков с понтами как ты. Вот только чаще после таких как ты переверстывать все приходится. |
|
06.06.2012, 15:51
|
|
Профессор
|
|
Регистрация: 21.12.2010
Сообщений: 243
|
|
|
Seva1986,
блока который центруется, хотя бы.
|
|
06.06.2012, 15:59
|
|
Профессор
|
|
Регистрация: 21.12.2010
Сообщений: 243
|
|
Seva1986,
"кртутой", и что ты там изменил? убери размеры у вложенного блока (заодно можешь убрать и у родительского, ради прикола  ) - куда твоё центрирование делось?
|
|
06.06.2012, 16:16
|
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
|
Сообщение от Nanto
|
|
убери размеры у вложенного блока (заодно можешь убрать и у родительского, ради прикола ) - куда твоё центрирование делось?
|
если вообще не задавать размеры то эмуляция ячейки табличной 2 вариант, если не задавать размеры только центрируемому блоку то можно ещё с line-height вариант, первый вариант.
Я показал 4 варианта для разных ситуаций, ты начал говорить
|
Сообщение от Nanto
|
|
По вертикали центруется либо через таблицы (или table-cell) - но этот вариант крайне не рекомендуется (могут вылезти уже другие баги), хотя если высота блоков не известна - это единственный вариант. Если высота известна то лучше через позиционирование и top:50%;margin-top:-x/2.
|
я сказал чтоб ты посмотрел на мой пост и увидел то что я уже описал тот вариант который ты предложил. что ты хочешь ещё?
Более правильные варианты это css3 но о них пока рано. |
|
06.06.2012, 16:28
|
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
|
devote,
Не пиздел бы ты хрень всякую, ты не знаешь моих работ как и я твоих, поэтому не говори про то что ты там видел, если ты табличный говнокодер то дело твоё.
Не надо говорить что и как я могу сделать, на квадратике не на квадратике. ты чисто бред несёшь.
Кстати вот ты говришь что мои варианты с центрированием говно ану покажи свой чтобы он отличался от моих как ты сказал говнокодерских только не надо щас про флексбокс писать или грид ит.д. а то флудишь херню всякую а умного нихрена не написал.
И вообще причём сдесь сайт не сайт, я для особо тупых в сотый раз повторяю я показал 4 варианта если нужно сайт центрировать то через ячейку вариант, или с line-height (если размеры не известны)
Последний раз редактировалось Seva1986, 06.06.2012 в 16:33.
|
|
06.06.2012, 16:43
|
|
Профессор
|
|
Регистрация: 21.12.2010
Сообщений: 243
|
|
О чём речь вообще???
Я к тому, что развели срач на несколько страниц - в Гугле всех забанили?
Хотя бы вот - зачем далеко ходить:
http://learn.javascript.ru/css-center
Но как писал devote, всё это идеализированные примеры - что будет с этими центрующимися блоками при переполненнии контентом, при наличии плавающих блоков и прочая... |
|
|
|
