#html #css
#HTML #css
Вопрос:
Я пытаюсь расположить разделы, вложенные в центрированную оболочку, так, чтобы они не перемещались при настройке размера браузера. Идея похожа на домашнюю страницу Facebook, где все разделы остаются центрированными и не перемещаются относительно друг друга, когда страница становится больше.
Все мои разделы вложены в этот:
#header {
width: 750px;
margin: 0 auto;
}
Что мне нужно сделать, чтобы расположить разделы внутри? Это как-то связано с позиционированием?
Извините, это немного расплывчатое объяснение, пожалуйста, попросите разъяснений!
Любая помощь была бы высоко оценена, спасибо.
Ответ №1:
Вероятно, у вас должен быть класс clearfix для этого контейнера div (см.http://www.positioniseverything.net/easyclearing.html )
Что касается внутренних разделов, float: left; и явно определенной ширины — это все, что вам нужно, чтобы они отображались рядом.
Комментарии:
1. Когда я устанавливаю для внутренних разделов значение float left, они не перемещаются, чего я и хочу. Есть ли способ расположить их в другом месте с тем же эффектом? Редактировать: О, я использовал top вместо margin-top. Не беспокойтесь!
2. И последнее — как мне центрировать div внутри div?
3.
margin: 0px auto;будет центрировать div внутри div при условии, что указана ширина.
Ответ №2:
Как эмпирическое правило: не используйте position: absolute . Это редко бывает лучшим способом добиться эффекта макета.
Если вы используете абсолютное позиционирование, то установите position: relative в контейнере так, чтобы он устанавливал новый контекст позиционирования, а элементы располагались относительно его краев, а не окна.
#header {
width: 750px;
margin: 0 auto;
position: relative;
}
Ответ №3:
Раньше у меня была такая же проблема, я исправил ее с помощью attr :
style=’минимальная ширина:970 пикселей;’
я надеюсь, что это поможет