Hallo,
ich habe innerhalb eines div eine Liste mit einigen Unterpunkten die mir leider nicht richtige angezeigt wird. Die Unterpunkte überlagern die nachfolgenden li und gehen über den Rand des div hinaus.
HTML
<div id="menu">
<h2><u>Hauptmenü</u></h2>
<ul>
<li><a href="startseite.php">Startseite</a></li>
<li><a href="impressum.php">Impressum</a></li>
<li><a href="stadt.php">meine Stadt</a></li>
<li><a href="modellbau.php">Modellbau</a>
<ul>
<li><a href="driften.php">- Driften</a></li>
<li><a href="karos.php">- meine Drifter / Karos</a></li>
<li><a href="offroad.php">- Offroad</a></li>
<li><a href="haendler.php">- Modellbauhändler</a></li>
<li><a href="ega2007.php">- EGA 2007</a></li>
<li><a href="ega2008.php">- EGA 2008</a></li>
<li><a href="ega2009.php">- EGA 2009</a></li>
<li><a href="ega2010.php">- EGA 2010</a></li>
<li><a href="ega2011.php">- EGA 2011</a></li>
<li><a href="umbau.php">- Eigen / Umbauten</a></li>
</ul>
</li>
<li><a href="galerie.php">Galerie</a></li>
<li><a href="uscars.php">US-Cars</a></li>
<li><a href="wrestling.php">Wrestling</a></li>
<li><a href="mittelalter.php">Mittelalter</a></li>
<li><a href="linkliste.php">Linkliste</a></li>
<li><a href="urlaub.php">Urlaub</a></li>
<li><a href="familienbuch.php">Familienbuch ©</a></li>
</ul>
</div>HTML
#menu {
float: left;
width: 185px;
height: auto;
margin: 15px 20px 10px 20px;
padding: 10px;
font-family: Verdana, Tahoma, Arial, sans-serif;
text-align: left;
}
#menu a {
display: block;
width: 100%;
text-indent: 15px;
text-decoration: none;
text-align: left;
font-family: Helvetica,Arial,sans-serif;
}
#menu a:link, #menu a:visited {
background: #080808;
width: 100%;
height: 100%;
margin-top: 0px;
}
#menu a:hover, #menu a:active, #menu a:focus {
background: #363636;
width: 100%;
height: 100%;
margin-top: 0px;
}
#menu ul {
list-style: none;
line-height: normal;
margin: 0px;
padding: 0px;
}
#menu li {
border-bottom: 1px solid #181818;
width: 100%;
height: 18px;
}
MFG