css margin: автоматическое не центрирование div в браузерах webkit (Chrome и Safari) при развернутом / полном экране - PullRequest
Новая
       31

css margin: автоматическое не центрирование div в браузерах webkit (Chrome и Safari) при развернутом / полном экране

0 голосов
/ 17 мая 2011

Мне не удалось определить причину этой проблемы, поэтому я не могу отобразить контрольный пример, вместо этого я сузил свой код до страницы, которая по-прежнему содержит ошибку без лишних лишних.
Вот ссылка:
http://www.richard -walsh.limewebs.com / Disk-редактирует / index.html

Проблема в том, что содержимое div (id = content) не центрируется в Chrome и Safari.
Он расположен справа.

Div содержимого окружен div, называемым bottom, ширина которого: 100%; и высота: авто;. 

#bottom{
    width:100%;
    height:auto;
    padding:0px;
    margin:0px;
}

#content{
    width:862.4px;
    height:402px;
    margin:auto;
    padding-left:10px;
    padding-right:10px;
    padding-top:5px;
    padding-bottom:5px;
    background-color:#030303;
    background-image:url(images/main.png);
    -moz-border-radius:15px;
    border-radius:15px;
    border-style:solid;
    border-color:#181818;
    border-width:4px;
    margin-top:60px;
    -moz-box-shadow: 1px 1px 20px 4px black;
    -webkit-box-shadow: 1px 1px 20px 4px black;
    box-shadow: 1px 1px 20px 4px black;
    overflow:hidden;
}

Я обнаружил, что если я удаляю переполнение: скрытое от содержимого css, то оно центрируется правильно Но мне это нужно (для деталей, не показанных в ссылке)

Я также обнаружил, что это работает, если я полностью удаляю меню. Поэтому я думаю, что в меню CSS должно быть что-то, что вызвало это. Он отлично работает в Firefox (4).

Я использую Chrome 11.0.696.68 и Safari 5.0.5

Oh! Я только что заметил, что это происходит только тогда, когда Chrome развернут, когда он находится в «оконном режиме» (из-за отсутствия лучшего имени), он идеально центрируется, даже если окно растянуто до полного размера экрана.

Я также заметил, что если вы удаляете #copyright, то #content отображается слева, а если удаляются и #copyright, и #choice, то div содержимого отображается в центре, а если вы удалите только #choice, по-прежнему отображается справа.

Если вы удалите #menu_all, он будет центрирован правильно.

Любая помощь будет принята с благодарностью,
Спасибо

Ответы [ 3 ]

2 голосов
/ 18 мая 2011

Решение:
У div над содержимым div (#copyright) не было объявлено значение высоты. Объявление значения высоты (35 пикселей) устранило проблему, с которой я столкнулся в chrome / safari.

высота: авто; не работал.

Это не объясняет, почему, когда div контента был помещен непосредственно под div авторского права, он работал. Но до сих пор. Это было работоспособное решение. Так что, если у вас похожая проблема, убедитесь, что у div выше объявлена ​​высота.

2 голосов
/ 17 мая 2011

Добавить отображение: блок, посмотреть, работает ли это.

0 голосов
/ 17 мая 2011 
<div id="content" class="post"></div>

Не в #middle, а в #bottom. Если вы переместите это вверх, раскладка будет работать правильно.

...