Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Центрирование div относительно родителя

Автор: localhost 29.1.2013, 12:10

Всем привет.

Дано: http://jsfiddle.net/uvrJD/5/
Здесь фоновая подложка двухцветная (красный, зеленый блоки), а также основной блок (серый) фиксированной ширины, который надо отцентрировать по горизонтали (одинаковые отступы слева и справа).

Обычно делал margin: 0 auto; но в этом случае оно не работает, видимо из-за абсолютного позиционирования родительского блока.
Ну, а иначе как сделать такой составной фон я не придумал.

Вобщем, просьба помочь отцентрировать блок по горизонтали. Заранее спасибо за советы smile

Автор: Aliance 29.1.2013, 12:21

Ставить body position в absolute по-моему не лучшая идея априори.

Автор: localhost 29.1.2013, 12:37

Цитата(Aliance @ 29.1.2013, 12:21

)

Ставить body position в absolute по-моему не лучшая идея априори.

Согласен, переделал
http://jsfiddle.net/uvrJD/8/

Автор: ksnk 29.1.2013, 13:04

Код


#wrapper {
    position: absolute;
    width: 500px;
    height: 350px;
    top: 50%;
    left: 50%;
    z-index: 100;
    margin: -175px 0 0 -250px;
}

#main {
    background-color: #e1e1e8;
    border: 2px solid #000;
    height: 100%;
}

марджины у #wrapper вычисляются как минус половины габаритов.

Автор: localhost 29.1.2013, 13:29

ksnk, спасибо!
Но получается, если задать ширину wrapper в 960px, на разрешении 1024х768 блок выезжает за пределы по горизонтали.

Автор: ksnk 29.1.2013, 13:39

Цитата(localhost @ 29.1.2013, 13:29

)

Но получается, если задать ширину wrapper в 960px, на разрешении 1024х768 блок выезжает за пределы по горизонтали.

С чего бы? В фидле, вроде, не вылезает.

Автор: localhost 29.1.2013, 14:06

Ну вот, у меня вылезает... http://jsfiddle.net/uvrJD/10/

Добавлено через 12 минут и 39 секунд
А не, вроде норм ) smile