Сосредоточение контента в середине страницы, когда внутри div, в одну сторону - PullRequest
0 голосов
/ 22 февраля 2011

У меня есть веб-страница с фиксированным столбцом 200 пикселей на одной стороне (содержит меню).Правая сторона имеет переменную ширину.Правая сторона будет заполнена с помощью AJAX.Для страницы по умолчанию (когда не выбран ни один пункт меню) я пытаюсь расположить логотип компании по центру по горизонтали на странице , а не в элементе div, в который он помещен.Ни один из тех CSS, которые я пробовал до сих пор, не работает, как ожидалось, с логотипом, перемещающимся влево или вправо от центра, так как размер окна браузера изменяется по горизонтали.Опасаясь потери оставшихся волос, я ищу предложения.

Дополнительная информация

CSS для двух столбцов (из Dreamweaver):

.sidebar1 {
float: left;
width: 200px;
padding-bottom: 10px;
}
.content {
padding: 10px 0;
width: 80%;
float: left;
}

Sidebar1столбец содержит меню.Правый (основной) столбец просто <div class="content"></div> и будет получать контент с сервера в зависимости от того, что было выбрано из меню.Этот div, конечно, справа от центра относительно страницы, но я бы хотел разместить логотип в div, но по центру страницы горизонтально.

1 Ответ

2 голосов
/ 22 февраля 2011

Если вам нужно, чтобы логотип содержал 80% контента, вы можете разместить его абсолютно. Это позволит размещать логотип по телу вместо .content (поскольку .content равно position:static).

Попробуйте этот jsbin

.content .logo { position: absolute; left: 48%; top: 10px; }
...