Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Расположить один див точно под другим


Автор: tenmet 20.8.2012, 17:45
Сделал два блока, один над другим 
Код

<div style="width:221px;height:40px;border-left:1px solid red;border-right:1px solid red;"></div>
<div style="width:221px;height:40px;border-left:1px solid blue;border-right:1px solid blue;"></div>

Но почему-то нижний сдвигается влево, буквально чуть-чуть, меньше пикселя, см фото. Можно их сделать ровно друг над другом?

Автор: Wolf1994 21.8.2012, 12:30
Элементы расположены ровно. То что вы видите - особенность дисплея составлять пиксель из нескольких разноцветных фрагментов. Из-за разной интенсивности цвета, тёмная полоса занимает всё отведённое ей место (потому что удалось подобрать под неё однородный цвет), а чтобы отобразить светлую нужно смешать два цвета: более и менее яркий (возможно, на качественном дисплее может быть выбран средний), что и создаёт данный эффект.

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

Автор: tenmet 23.8.2012, 17:46
Ясно, ну ладно, против физики не попрешь)

Автор: ardeler 26.8.2012, 15:04
нечего невозможного не вижу ... 
попробуй так

Код

<div style="width:221px;height:40px;border-left:1px solid red;border-right:1px solid red; display:block; clear:both;"></div>
<div style="width:221px;height:40px;border-left:1px solid blue;border-right:1px solid blue; display:block;clear:both;"></div>

либо так 
Код

<div style="width:221px;height:40px;border-left:1px solid red;border-right:1px solid red; "></div>
<div style="display:block; clear:both;"></div>
<div style="width:221px;height:40px;border-left:1px solid blue;border-right:1px solid blue;"></div>

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)