<div> macht Abstand im IE, wieso??
Peete
- css
Hallo zusammen !
Habe folgenden Quelltext:
<html>
<head>
<title>Test</title>
<style type="text/css">
.box{
background-image:url(../i/box.gif);
vertical-align:middle;
font-weight:bold;
}
.line{
width:140px;
border-bottom:1px #000000 solid;
}
</style>
</head>
<body>
<div class="box"><div>Überschrift</div></div>
<div class="line"></div>
<div>Darunter</div>
</body>
</html>
Kann mir jemand sagen, wieso der IE (zumindest v6.0) hier einen Riesen-Abstand von ca.10px zwischen 'Überschrift' und dem 'border-bottom' macht bzw. wie man das beheben kann??
Viele Dank für Hilfe :) !!
Probier es mal hiermit:
.box{
background-image:url(../i/box.gif);
vertical-align:middle;
font-weight:bold;
margin-bottom:0px;
}
.line{
width:140px;
border-bottom:1px #000000 solid;
margin-top:0px;
}
Und das doppelte div ist überflüssig:
<div class="box">Überschrift</div>
Tachchen!
Und das doppelte div ist überflüssig:
<div class="box">Überschrift</div>
Der eine DIV ist es auch: H1-H6 wäre wohl angebracht.
Gruß
Die schwarze Piste
Ich habe den Text mal auf das Wesentliche gekürtzt:
<html>
<head>
<title>Test</title>
<style type="text/css">
.box{
margin-bottom:0px;
}
.line{
margin-top:0px;
width:140px;
border-bottom:1px #000000 solid;
}
</style>
</head>
<body>
<div class="box">Überschrift</div>
<div class="line"></div>
<div>Darunter</div>
</body>
</html>
Die 'margins' beseitigen das Problem leider immer noch nicht, und mit einem ÜberschriftenTag passiert auch das gleiche. Der Witz ist, es funktioniert, wenn ich das 'width:140px' rausnehme, aber dann geht die Linie natürlich über die ganze Seite...
Noch eine Idee??
'
Hi,
Mal ne blöde Frage.. beinhaltet dieses div mit der Klasse "line" überhaupt Text? Falls ja, wozu hast du das überhaupt?
Gruss
shin
Nein, kein Text, aber wie mache ich sonst eine Linie bestimmter Länge mit ausschließlich CSS-Design??
Nein, kein Text, aber wie mache ich sonst eine Linie bestimmter Länge mit ausschließlich CSS-Design??
Indem du das, worunter oder worüber die Linie soll, in ein Div einkapselst, wenn es nicht bereits selbst ein Blockelement ist und dann eben darauf die CSS anwendest.
Indem du das, worunter oder worüber die Linie soll, in ein Div einkapselst, wenn es nicht bereits selbst ein Blockelement ist und dann eben darauf die CSS anwendest.
Damit hab ich jetzt auch ganz guten Erfolg, Danke !
Aber wie kann ich dann zum Beispiel eine Graphik flexibel einbinden?
Also so zB:
<style type="text/css">
.graphik{
background-image:url(2px-hoche-Graphik.gif)
}
</style>
...
<div class="graphik"></div>
denn so macht der IE keinen 2px hohen Kasten, sondern einen ca. 10px hohen...auch ein 'height' in der Klasse kann da nichts ausrichten...
Gibt es eine Lösung?
Hallo Peete
<style type="text/css">
.graphik{
background-image:url(2px-hoche-Graphik.gif)
line-height:2px;
}
</style>
Auf Wiederlesen
Detlef