habe folgendes Problem:
Wie ihr auf dem Bild erkennen könnt, hängt der gelbe Navi-Bereich innerhalb des oliven Content-Bereich. Das sollte aber so nicht sein. Das Problem ist eigentlich nur der olive "Streifen" oberhalb des gelben Navi Bereichs, den ich so einfach nie wegbekomme. Vielleicht könnt ihr mir helfen. Hier die Codes:
html-code:
- Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Layout-Test1</title>
<meta name="author" content="TEST">
<meta name="editor" content="html-editor phase 5">
<link rel="stylesheet" media="all" href="css/norm.css">
</head>
<body>
<div id="wrapper">
<ul id="navi" style="list-style-type:none">
<li>Home</li>
<li>Profil</li>
<li>Kontakt</li>
</ul>
<div id="content">
<p>Er hörte leise Schritte hinter sich. Das bedeutete nichts Gutes. Wer würde ihm schon folgen, spät in der Nacht und dazu noch in dieser engen [...]</p>
</div>
</div>
</body>
</html>
css-code:
- Code: Alles auswählen
#wrapper {
width: 80%;
margin-top: 30px;
margin-left: 50px;
background-color: olive;
}
#navi {
float: left;
width: 130px;
padding: 00px 40px 140px 20px;
background-color: #ffdb20;
}
#navi li {
font: 1.2em Tahoma, Arial, sans-serif;
}
#content {
color: #fff;
padding: 0px;
background-color: olive;
}
p {
padding: 30px;
color: #fff;
}
Woran liegts?

