Jonathan Harker: Media Queries

Beitrag lesen

Guten Morgen,

ich versuche mich gerade das erste mal an MediaQueries und habe mir dazu folgenden Programmcode gebaut:

gut

Darüber hinaus hab ich einen kleinen Schnipsel Javascript der dafür sorgt, dass das nav bei Klick auf den "menubutton" ein- bzw. ausgeblendet wird.

Warum nicht mit CSS?

Navigation ausblenden und mit Navicon aufrufen

Jetzt habe ich folgendes Problem: Wenn ich auf meinem Desktop-PC das Browserfenster kleiner ziehe (also unter 400px) nimmt das nav genau wie gewünscht Blockform an und der Menübutton erscheint. Wenn ich auf diesen klicke kann ich das nav genau wie geplant ein- und ausblenden. Also alles super. Wenn ich das nav jedoch ausblende und dann das Browserfenster wieder größer ziehe verschwindet der Menübutton und ich habe keine Chance mehr mir das nav einblenden zu lassen.

.nav li{
   width:100%;
}

@media (min-width:400px){
   #menubar img{
      display:none;

Das ist doch im CSS gewollt, dass der Menübutton verschwindet, oder?

Wie kann ich es lösen, dass mein nav IMMER eingeblendet ist, sobald ich in den Bereich von mehr als 400px Bildschirmbreite komme?

Das CSS entfernen.

BTW: Lege media queries in em fest, dann kann die Webseite auch automatisch auf Änderungen der Standardschriftgröße reagieren und zerschießt dir nie das Layout.

Gruß Jo