Некорректное отображение сайта при различном разрешении монитора

[olya]

Здравствуйте.

Подскажите пожалуйста, как при большом разрешении монитора, больше чем 1024*768 разместить два дива по центру.

При большом разрешении монитора дивы распологаются слева, а остальное пустота, смотрится ужасно.

Пробовала разные способы, но получается некорректно. Пробовала поместить два дива в общий див и его разместить по центру- не получилось, а также с помощью float и тоже неудача.

Ссылка на страницы с моими непослушными дивами:

http://olyakutukova.narod.ru/brauser.html

http://olyakutukova.narod.ru/ocna.html

[Veseloff]

Ну всё правильно отображается. У вас там position: absolute и чёткое задание left. Если хотите использовать absolute, то поставьте блок однопиксельной ширины с margin: 0 auto (то есть он встанет по центу) и сделаёте ему position: relative; Ну и для блоков

layer1

position: absolute;
right: -2px;

layer2

position: absolute;
left: -2px;

[olya]

спасибо за помощь. margin:0 auto пробовала но не задавала ему position:relative

[olya]

спасибо за помощь. margin:0 auto пробовала но не задавала ему position:relative

Выполнила все как вы посоветовали,но при большом разрешении монитора два дива Lauer1 и Lauer2 внутри общего дива располагаются далеко друг от друга

Как сверстать чтоб Lauer2 распологался чуть-чуть дальше Lauer1

[psywalker]

Попробуй этот способ дружище.

ul { text-align: center;}

ul li {display: inline-block; margin: 0 20px; //zoom:1; //display: inline; ширина;}

[olya]

Попробуй этот способ дружище.

ul { text-align: center;}

ul li {display: inline-block; margin: 0 20px; //zoom:1; //display: inline; ширина;}

Я не поняла зачем мне нужен ul, ul li у меня не меню, а два дива, которые нужно разместить по центру при любых разрешениях монитора

[swetlana]

ёлы-палы. Да какие проблемы-то?

Для #container добавьте width: 990px, и всё будет нормально.

[c01nd01r]

Попробуйте вот так:

#container{
						   margin:0px auto;  
		   overflow:hidden;
		   height: auto;
		   width: 968px;
		}
#Layer1 {
			float:left;
	width:460px;
	border: 1px solid black;
	padding:10px;
	font-size:13pt;
	}
#Layer2 {	
			float:right;
	width:460px;
	border: 1px solid black;
	padding:10px;
	font-size:13pt;

}

[olya]

Попробуйте вот так:

#container{
						   margin:0px auto;  
		   overflow:hidden;
		   height: auto;
		   width: 968px;
		}
#Layer1 {
			float:left;
	width:460px;
	border: 1px solid black;
	padding:10px;
	font-size:13pt;
	}
#Layer2 {	
			float:right;
	width:460px;
	border: 1px solid black;
	padding:10px;
	font-size:13pt;

}

Спасибо большое.Попробую

[psywalker]

Я не поняла зачем мне нужен ul, ul li у меня не меню, а два дива, которые нужно разместить по центру при любых разрешениях монитора

Да причём тут меню. Я тебе идею подсказал. Ты тоже самое можешь проделать со слоями.

[swetlana]

ау, народ!?

Какие идеи там, где решается в одну строчку?

Надо только успокоиться, посмотреть на сайт веб-инспектором, да поставить ширину там, где её поставить забыли. И всё.

А если делать что-то большее, то имеет смысл лишь всё заново сверстать, да попроще, без имеющегося мудрежа.

[olya]

ау, народ!?

Какие идеи там, где решается в одну строчку?

Надо только успокоиться, посмотреть на сайт веб-инспектором, да поставить ширину там, где её поставить забыли. И всё.

А если делать что-то большее, то имеет смысл лишь всё заново сверстать, да попроще, без имеющегося мудрежа.

а что здесь мудреж?

[swetlana]

честно?

почти всё.

Какие-то абсолюты напрочь ненужные.

Задача ведь из простейших.

ну и так, не то чтобы это была ошибка, но всё же интересно: дизайн и вёрстка в духе девяностых — это фишка такая?

[dubass_]

честно?

почти всё.

Какие-то абсолюты напрочь ненужные.

Задача ведь из простейших.

ну и так, не то чтобы это была ошибка, но всё же интересно: дизайн и вёрстка в духе девяностых — это фишка такая?

ну что вы человека мучаете? он всего лишь учится, нужно подсказать куда копать)) Задача действительно из простейших.

Оля, идея такая. Один общий див, скажем фиксированной ширины = 1000px, равнение которого - по центру экрана.

Этого вы достигнете так:

.div {
	width:1000px;
	margin:0 auto; // - равнение по центру (горизонт)
}

Потом беритесь за вложенные блоки. В вашем случае, если их 2 и они одинаковой ширины, можно сделать так:

.div1, .div2 {
	width:50%;
	float:left;
}

в общих чертах так, пробуйте

[swetlana]

	width:50%;

а про отступы забываем?

[dubass_]

а про отступы забываем?

может мне еще целиком ей сайт сверстать? если на то пошло, я не указывал высоту блоков, поэтому ничего видно не будет

[swetlana]

может мне еще целиком ей сайт сверстать?

а слабо?

[olya]

Спасибо большое всем за внимание. Я все ваши подсказки поняла.