Media Queries - Horizontales Menü für Monitor ab 980px
Ans Ende der style.css einfügen
/*
Hauptmenü
Die Menüpunkte erscheinen mit nav li {float: left; } nebeneinander,
sie werden auf der ganzen Seitenbreite angezeigt mit width:100%;
Hintergrund hellgrau background-color:lightgrey;
Abstand innen nach unten margin-bottom:1.5em;
*/
nav li { float:left; }
nav ul {
width:100%;
float:left;
background-color:lightgrey;
margin-bottom:1.5em;
}
/*
Untermenü
Untermenüs erst bei Bedarf aufklappen (Maus über dem Hauptmenüpunkt,
daher vorher verbergen nav li ul { display:none; }
Anzeige nur wenn mit der Maus angeklickt
*/
nav li ul { display:none; }
nav li:hover ul {
display:block;
position:absolute;
width:auto;
}
nav li:hover ul li {
float:none;
}
nav ul ul li a {
padding-left:0.5em;
}