DIV с фоном.
Дано:
Есть три дива в строчку, стоят вплотную и без проблем так отображаются во всех браузерах. Как только применяю к этим дивам бэкграундом картинки - в ИЕ начинается война. Средний див отползает от соседей и остается зазор, который никак не лечится.
Решение:
Есть ли?
html код и css в студию (с примечаниями).
<div id="Left">3</div>
<div id="Right">4</div>
<div id="Center">5</div>
CSS (до фона):
#Left
{float:left;
width:250px;
height:100%;
border-right:1px solid #3F6680;}
#Right
{float:right;
width:250px;
height:100%;
border-left:1px solid #3F6680;}
#Center
{margin:0px;
padding:0px;
height:100%;}
CSS (после включения фона):
#Left
{float:left;
width:250px;
height:100%;
background:url('fon3.gif') repeat-x #143850;
border-right:1px solid #3F6680;}
#Right
{float:right;
width:250px;
height:100%;
background:url('fon3.gif') repeat-x #143850;
border-left:1px solid #3F6680;}
#Center
{margin:0px;
padding:0px;
height:100%;
background:url('fon3.gif') repeat-x #143850;}
До того, как я указал фон - все работает (дивы вплотную стоят), как только указываю фоновое изображение, средний див сжимается.
ни чего не сжимается, смотрел в осле и лисе.
Что за беда-то (( Прикладываю код - конкретно этот код у меня в ИЕ плывет. В Опере ОК.
Мож я просто хрень где-нить написал? И дело не в глобальном баге ИЕ, а в локальном пробеле в моей внимательности?
Надо было убить для центрального дива значение:
height:100%;
И все стало на свои места. Бррр!