Ich habe 2 div's untereinander die zusammen ein Hintergrundbild ergeben sollen (header und topnavi).
Soweit so gut.
Geb ich im unteren div irgendwelche Textinhalte ein, passt auch alles prima, aber sobald ich statt dessen eine Liste für die links eingebe, habe ich auf einmal einen Abstand zwischen den beiden divs, der das bild trennt.
html:
Code:
<body>
<div id="container">
<div id="header"></div>
<div id="topnavi">
<ul id="navlist">
<li><a href="#">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<div id="container2">
<div id="leftnavi"></div>
<div id="content"></div>
</div>
<div id="footer"></div>
</div>
</body>
css:
Code:
/*#######Allgemeines #######*/
* {
margin: 0;
padding: 0;
border: 0;
}
html,body {
background: #000066;
}
ul {
list-style: none;
}
/*##### container #########*/
div#container {
position: relative;
text-align: left;
width: 780px;
margin: 0 auto;
border: 2px solid #000000;
}
/*######## Header ############*/
div#header {
width: 780px;
height: 150px;
background: url(../bilder/header_back.jpg) no-repeat;
}
/*###### top Navigation ##########*/
div#topnavi {
width: 780px;
height: 50px;
background: url(../bilder/topnavi_back.jpg) no-repeat;
}
#navlist li{
display: inline;
padding-right: 20px;
}