Pulldownmenü - a:hover

[_fabi]

Hallo, ich habe ein Problem mit meinem Pulldownmenü und ich bekomme es einfach nicht weg. Wenn man auf Anwendungen geht sieht man das Problem schon.
Hier noch mal der CSS-Code:

  
  
body {  
	background-attachment:fixed;  
	background-color:#ffe4c4;  
}  
  
  
/*-------------------HEAD-------------------*/  
  
div.head {  
  width: 1000px;  
  height: 200px;  
  margin: 0 auto 2px auto;  
  text-align: center;  
  background: #FFF;  
}  
  
/*-------------------NAVIGATION-------------------*/  
  
div.navigation {  
  background-color:#a9aaac;  
  width: 1004px;  
  height: 40px;  
  margin: auto;  
  overflow: hidden;  
}  
  
/*-------------------CONTENT-------------------*/  
  
div.content {  
  background-color:#972b28;  
  width: 1004px;  
  height: 1004px;  
  margin-top: 2px;  
  margin-bottom: 2px;  
  margin-left: auto;  
  margin-right: auto;  
  color: #FFF;  
  font:12px "Arial Black", AlManzomah,Helvetica, sans-serif;  
 }  
  
div.content h1 {  
  text-align:center;  
  margin: 0;  
}  
  
div.content h3 {  
  text-align:left;  
  margin: 10px 0 -18px 30px;  
}  
  
div.content p {  
  text-align: left;  
  margin: 18px 30px 20px 30px;  
}  
  
div.content a {  
  text-decoration: underline;  
  font-weight: normal;  
  color: #000;  
}  
  
/*-------------------LINKS-------------------*/  
  
div.navigation a:link, div.footer a:link, div.head a:link {  
  text-decoration: none;  
  font-weight: normal;  
  color: #FFF;  
  font-size: 13px;  
}  
  
div.navigation a:visited, div.footer a:visited, div.head a:visited {  
  text-decoration: none;  
  font-weight: normal;  
  color: #FFF;  
  font-size: 13px;  
}  
  
div.navigation a:hover, div.footer a:hover, div.head a:hover {  
  text-decoration: none;  
  font-weight: normal;  
  background-color: #FFF;  
  color: #809e44;  
  font-size: 13px;  
}  
  
div.navigation a:active, div.footer a:active, div.head a:active {  
  text-decoration:none;  
  font-weight: normal;  
  background-color:#FFF;  
  font-size: 13px;  
}  
	  
div.navigation a:focus, div.footer a:focus, div.head a:focus {  
  text-decoration:none;  
  font-weight: normal;  
  background-color:#FFF;  
  font-size: 13px;  
}  
  
/*-------------------FOOTER-------------------*/  
  
div.footer {  
  background: transparent url(img/navi_bottom.gif) no-repeat;  
  width: 1004px;  
  height: 20px;  
  margin: 2px auto;  
  text-align: right;  
  font-size: 11px;  
  color: #FFF;  
}  
  
div.footer p {  
  margin: 0 10px 0 0;  
  font-size: 13px;  
}  
  
/*-------------------STUFF-------------------*/  
  
img {  
  border: 0;  
}  
  
/*-------------------SCRIPT-------------------*/  
  
.sddm{  
  margin: 0;  
  padding: 0;  
  text-align:center;  
  z-index: 30;  
  width: auto;  
}  
  
.sddm li{  
  margin: 0;  
/*  padding: 0;*/  
  list-style: none;  
  float: left;  
}  
  
.sddm li a{  
  display: block;  
  margin: 10px 1px 0 0;  
  width: 100px;  
  background: #a9aaac;  
  color: #FFFFFF;  
  text-align: center;  
  text-decoration: none;  
}  
  
.sddm li a:hover{  
  background: #972b28;  
  height: 40px;  
  margin: 0 0 -10px 0;  
  padding: 10px 0 0 0;  
  color: #FFF  
  
}  
  
.sddm div{  
  position: absolute;  
  visibility: hidden;  
  margin: 0;  
  background: #000;  
  border: 1px solid #a9aaac;  
  width: 190px;  
  padding: 0;  
}  
  
.sddm div a{  
  display: block;  
  height:30px;  
  margin: 0;  
  padding: 10px 0 0 0;  
  white-space: nowrap;  
  text-align: left;  
  text-decoration: none;  
  background: #000;  
  color: #FFF;  
  font: 12px "Arial Black", AlManzomah, Helvetica, sans-serif;  
}  
  
.normal {  
  margin: 0;  
  height: 30px;  
  padding: 0;  
}  
  
.sddm div a:hover.normal {  
  background: #972b28;  
  color: #FFF;  
  margin: 0;  
  width: 190px;  
  height: 30px;  
  padding: 0;  
}  
  
.sddm div a:hover.normal#wohl {  
  background: #972b28;  
  color: #FFF;  
  margin: 0;  
  width: 190px;  
  height: 30px;  
  padding: 10px 0 0 0;  
}  
  
.big {  
  margin: 0;  
  padding: 0 0 20px 0;  
  vertical-align: middle;  
  background: red;  
}  
  
.sddm div a:hover.big {  
  background: #972b28;  
  color: #FFF;  
  margin: 10px 0 0 0;  
  width: 190px;  
  height: 45px;  
  padding: 0 0 0 0 ;  
}  

Die seite ist hier zu finde.
Ich hoffe es kann mir jemand helfen.

Danke und Gruß

_fabi

[Beat]

Hallo, ich habe ein Problem mit meinem Pulldownmenü und ich bekomme es einfach nicht weg. Wenn man auf Anwendungen geht sieht man das Problem schon.

Die seite ist hier zu finde.
Ich hoffe es kann mir jemand helfen.

Bereinige bitte zuerst die Fehler im Code.
http://validator.w3.org/check?uri=http%3A%2F%2Ffabianrohrka.guckes-webstyle.com%2Fschoenverwoehnt%2Frelaunch%2F&charset=(detect+automatically)&doctype=Inline&group=0

Stichworte:
<li> kann als Parentelement nur <ul> <ol> aber kein <div> haben.
IDs müssen dokument-weit einmalig sein.

mfg Beat

[_fabi]

Bereinige bitte zuerst die Fehler im Code.
Stichworte:
<li> kann als Parentelement nur <ul> <ol> aber kein <div> haben.
IDs müssen dokument-weit einmalig sein.

so alles bereinigt. aber ich komme jetzt immer noch nicht weiter.

[Detlef G.]

Hallo _fabi

so alles bereinigt. aber ich komme jetzt immer noch nicht weiter.

Welchen Sinn soll so eine Struktur haben?

  <div>  
    <div>  
      <ul>  
       <li><a></a></li>  
      </ul>  
    </div>  
  
    <div>  
      <ul>  
      <li><a></a>  
	<div>  
	  <a></a>  
	  <a></a>  
	  <a><br /></a>  
	  <a></a>  
	  <a></a>  
	</div>  
      </li>  
      </ul>  
    </div>  

Wozu Listen, die nichts auflisten, stattdessen <div>s im einzigen Listenpunkt und darin dann die Links einfach aneinandergereiht?

Eine sinnvolle Struktur könnte so aussehen:

  
  <ul>  
    <li><a></a></li>  
    <li><a></a>  
      <ul>  
        <li><a></a></li>  
        <li><a></a></li>  
        <li><a></a></li>  
        <li><a></a></li>  
        <li><a></a></li>  
      </ul>  
    </li>  
    <li><a></a></li>  
  </ul>  

Schau dir mal CSS-basierte Navigationsleisten an.

Auf Wiederlesen
Detlef