[xhtml/css] IE zwiększa "height" diva Opcje

[kazag]

Mam sobie taki oto kod html:

[HTML] pobierz, plaintext 
<div id="infobox">
				<div id="c1"></div><div class="blackbar"></div><div id="c2"></div>
 
				<div id="mainnews">
				</div>
 
				<div id="othernews">
				</div>
 
				<div id="c3"></div><div class="blackbar"></div><div id="c4"></div>
</div>
[HTML] pobierz, plaintext 

Do tego taki oto css:

[HTML] pobierz, plaintext 
#infobox {
width:950px;
height:200px;
margin:0px;
padding:0px;
}
 
#c1, #c2, #c3, #c4 {
width:7px;
height:7px;
float:left;
margin:0px;
}
 
.blackbar {
width:936px;
float:left;
background:#000;
padding:0px;
margin:0px;
height:7px;
}
 
#c1 {
background:url(img/c1.png) no-repeat;
}
 
#c2 {
background:url(img/c2.png) no-repeat;
}
 
#c3 {
background:url(img/c4.png) no-repeat;
clear:both;
}
 
#c4 {
background:url(img/c3.png) no-repeat;
}
 
#mainnews {
clear:both;
width:600px;
height:186px;
background:#000;
float:left;
}
 
#othernews {
width:350px;
height:186px;
background:#000;
float:right;
}
[HTML] pobierz, plaintext 

Nie zważajcie, ze c3 ma obrazek c4 i odwrotnie, bo mi sie nazwy pomysliły zapisując grafikę.

Problem polega na tym, że pięknie mi sie div z rogami zaokrąglonymi robi pod wszystkimi przegladarkami prócz: IE 6.
Czy ktoś mi wyjaśni, czemu to chol.erstwo zwiększa wysokość diva "blackbar"? Jak ustawie go na 1px to nic nie daje.

edit: oczywiscie moglbym to na absolutach zrobić, ale tego nie lubię, także jesli ktos ma pomysł to prosze o radę.

Ten post edytował kazag 18.02.2009, 21:48:04

[Rafal Filipek]

mozesz dać

Kod

overflow: hidden;

albo spróbować też

Kod

font-size: 0

dla tego diva

[kazag]

O, częściowo problem rozwiazany, tzn blackbar ma juz tlyko 7pikseli, aczkowlwiek pozostała przerrwa ponizej niego, którą wczesniej zapełniał. Dodam, ze marginesy wyzerowałem.

[Rafal Filipek]

bo teraz pewnie div w ktorym znajduje sie ten "blackbar" ma zlą wysokość.

[kazag]

Nie nie, on ma 200px ustawione, co oczywiście wszystkie przegladarki respektują, prócz IE, który go rozciaga zależnie od tresci. Jak dam mu overflow:hidden (nadrzędnemu infoboxowi), to jedynie ucina go (przynajmniej cos poprawnie interpretuje).

[mls]

Dodaj to samo (overflow i font-size) również do #c1, #c2, #c3 i #c4.