Hallo,
ich habe folgenden HTML-Seite mit einem Dropdownmenü ohne javascript:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title>Willkommen</title>
<link href="css/style2.css" rel="stylesheet" type="text/css">
<style type="text/css">
#dropdown
{
list-style-type: none;
width: 920px;
height: 20px;
margin-left: 0;
padding: 0;
}
#dropdown li
{
float: left;
padding: 0;
margin: 0 1px 0 0;
position: relative;
width: 130px;
height: 1px;
z-index: 100;
}
#dropdown li a, #dropdown li a:visited
{
text-decoration: none;
}
#dropdown dl
{
position: absolute;
top: 0;
left: 0;
width: 130px; margin: 0; padding: 0;
background: transparent url(transparency.gif);
}
#dropdown dt {
background: #B03B44;
margin: 0;
font: bold 13px Verdana,Arial,Helvetica;
border-left: 0px solid #FFFFFF;
border-bottom: 0px solid #FFFFFF;
border-top: 0px solid #FFFFFF;
width: 130px;
float: left;
}
#dropdown dd
{
display: none;
background: transparent url(transparency.gif);
border-bottom: 1px solid #7B5558;
clear: left;
margin: 0;
padding: 0;
color: #FFFFFF;
font: bold 13px Verdana,Arial,Helvetica;
text-align: center;
}
#dropdown dt a, #dropdown dt a:visited
{
display: block;
text-align: center;
font: bold 13px Verdana,Arial,Helvetica;
color: #ffffff;
padding: 3px 3px 3px 3px;
width: 125px;
}
#dropdown dd a, #dropdown dd a:visited
{
background-color: #B03B44;
font: bold 13px Verdana,Arial,Helvetica;
color: #ffffff;
text-decoration: none;
display: block;
padding: 4px 5px 4px 8px;
width: 118px;
}
#dropdown li a:hover
{
border: 0;
}
#dropdown li:hover dd, #dropdown li a:hover dd
{
display: block;
width: 130px;
background-color: #B03B44;
color: #000000;
}
#dropdown li:hover dl, #dropdown li a:hover dl
{
width: 130px;
}
#dropdown li:hover dt a, #dropdown li a:hover dt a, #dropdown dd a:hover
{
background-color: #B03B44;
color: #000000;
}
</style>
</head>
<body>
<div id="top">
<div id="navi_block">
<ul id="dropdown">
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="first">
<dt><a href="front_content.php?idart=8&idcat=1">Startseite</a></dt>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="second">
<dt><a href="">Link1</a></dt>
<dd><a href="">Link1a</a></dd>
<dd><a href="">Link1b</a></dd>
<dd><a href="">Link1c</a></dd>
<dd><a href="">Link1d</a></dd>
<dd><a href="">Link1e</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="third">
<dt><a href="">Link2</a></dt>
<dd><a href="">Link2a</a></dd>
<dd><a href="">Link2b</a></dd>
<dd><a href="">Link2c</a></dd>
<dd><a href="">Link2d</a></dd>
<dd><a href="">Link2e</a></dd>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="fourth">
<dt><a href="">Link3</a></dt>
<dd><a href="">Link3a</a></dd>
<dd><a href="">Link3b</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="fifth">
<dt><a href="">Link4</a></dt>
<dd><a href="">Link4a</a></dd>
<dd><a href="">Link4b</a></dd>
<dd><a href="">Link4c</a></dd>
<dd><a href="">Link4d</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="sixth">
<dt><a href="">Link5</a></dt>
<dd><a href="">Link5a</a></dd>
<dd><a href="">Link5b</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#"><table><tr><td><![endif]-->
<dl class="seventh">
<dt><a href="">Link6</a></dt>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
<div id="main">
<br><br><br><br>
Inhalt
<br><br><br><br>
</div>
</div>
<div id="bottom">
<a class="foot" href="">Impressum</a> <b>·</b>
<a class="foot" href="">Kontakt</a> <b>·</b>
<a class="foot" href="">Links</a><br><br>
</div>
</body>
</html>
ich möchte gerne, dass das untermenü als zeile unter der hauptmenü-zeile angezeigt wird (siehe: www.bild.de). kann mir jemand sagen, wie ich die css anpassen muss, damit das bei mir auch so erscheint?
Danke und Gruss, Martin