Einzelnen Beitrag anzeigen
  #8 (permalink)  
Alt 17.01.2014, 18:17
Benutzerbild von Manfred62
Manfred62 Manfred62 ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2009
Ort: Ludwigsburg
Beiträge: 2.134
Manfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nettManfred62 ist einfach richtig nett
Standard

zum einfachen umrechnen px-em: Pixel in EM umrechnen*

zu responsive allgemein:
am einfachsten vom denken her ist desktop --> mobil. Die media-queries beginnen i.d.R. mit max-width.
mobile first (mobil --> desktop) ist der aktuelle 'Weg'. Das schwächste Glied in der Kette (Smartphone) wird zuerst bedient. Die media-queries beginnen i.d.R. mit min-width.
Ich nutze als Basis gern PocketGrid. In der Doku gibts jede Menge Beispiele.

Z.B. deine Seite:
die Navigation oben hat 6 Links --> Breite 100%:6
die Footer Navi hat 3 Links --> Breite 100%:3
die Boxen in der Mitte machst genauso --> 100% durch 3 minus seitlicher Abstand

mit media-queries legst dann fest, was sich ab bestimmten Breiten (in em) ändern soll.

zur Navigation: ist machbar, kommt auf den Aufwand an welchen man in Kauf nimmt.
einfachste Variante (wenn man wenig Links hat): kein toggle, alle Links 100% breit, vertikal aufeinander.
nächste Möglichkeit: man nimmt etwas js zu Hilfe. Gibt zig Tutorials dafür.
Die o.g. Methode mit target (ohne js): ist mehr Aufwand. Habs mal nachgebaut. Ist etwas tricky...
Mit Zitat antworten