Hallo ich habe fogenden Code:
<div id="entirerange">
<div id="headrange">
<ul class="links">
<li><a href=""><img src="./graphics/test.png" height="20px" alt=""></a></li>
<li><a href=""><img src="./graphics/test.png" height="20px" alt=""></a></li>
<li><a href=""><img src="./graphics/test.png" height="20px" alt=""></a></li>
</ul>
</div>
</div>
dazu die CSS-Infos:
#entirerange {
width:700px;
margin-left:auto;
margin-right:auto;
margin-top:30px;
border:1px solid black;
text-align:left;
voice-family:""}"";
voice-family:inherit;
width:698px; }
html>body #entirerange {
width:698px; }
#headrange {
height:110px;
background:url('../graphics/headgraphic.png'); }
img {
vertical-align:bottom;
border:none; }
ul {
padding:0px;
margin:0px; }
li {
padding:0px;
margin:0px;
list-style-type:none;
float:left; }
ul.links { margin-top:90px; }
Das Problem ist wie im Bild: das div headrange soll 110px hoch sein und ul soll 90px von Oberkante headrange entfernt sein, doch er erweitert die Höhe um margin-top, also 110px+90px!
Auf dem Bild kann man das hoffentlich nachvollziehen! Was ist der Fehler? So wie im Bildteil unten soll es sein ...