PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : CSS: Bild im DIV mit Abstand zum oberen Rand, warum?


MadManniMan
2008-05-15, 22:44:08
Ahoi ihr Dieseiner!

Ich bastel mir grad ein Template zusammen und hab ein vielleicht banales Problem - was CSS anbelangt bin ich übrigens ziemlich grün, lasst also bitte Nachsicht walten!

Folgender Quellcode:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<style type="text/css">
body { background-color:#220000;}
#navi { width:800px; height:30px; margin:auto; background-color:#bbbbbb;}
#verlauf { width:800px; margin:auto; background-color:#cccccc;}
</style>
</head>

<body>
<div id="navi"></div>
<div id="verlauf">
<img src="balken.gif" height="10" width="800">
</div>
</html>


Zum live Nachvollziehen hab ich die beiden Dateien, also HTML und Bild angehängt.

Ich habe keine Ahnung, warum, aber es entsteht ein Zwischenraum zwischen dem oberen DIV (dunkelgrau) und dem Verlauf im unteren DIV (hellgrau, Hintergrund sollte aber eben gar nicht zu sehen sein) - woher kommt das und wie kann ich das fixen?


Grüßli, Manni

esistich
2008-05-16, 02:18:38
so kannst du es wie gewollt darstellen.

<img src="balken.gif" height="10" width="800" style="display:block;">

oder du lässt dieses Bild als Hintergrund darstellen

<html>
<head>
<style type="text/css">
body { background-color:#220000;}
#navi { width:800px; height:30px; margin:auto; background-color:#bbbbbb;}
#verlauf { width:800px; height:10px; margin:auto; background:#cccccc url("balken.gif") repeat-x;}
</style>
</head>

<body>
<div id="navi"></div>
<div id="verlauf"></div>
</body></html>

MadManniMan
2008-05-16, 07:09:43
Besser hätten Deine Antworten gar nicht sein können - ich ich kann mich auch gar nicht genug bedanken!

Hut ab! =)