Stylesheet, Media Queries und Handy

[LeanderAT]

Danke!

Wieso kompliziert? Musste nur den Code einfügen und leite dann alle mobilen User auf die mobile Seite.

Mein normales Menü will ich lassen, da kann ich keine Wechselmöglichkeit mit CSS einbauen.

Das normale Menü hat 10 Einträge. Das will ich aber nicht verschachteln. Für die mobile Version werd ich alles in 3-4 Einträge geben mit Dropdown...da müssen aber die Texteinträge anders sein als beim normalen Menü mit den 10 Einträgen...und somit geht es nicht ohne Umleitung und rein mit CSS.
Ist aber kein Problem, ist eh schnell gemacht.

 

[sedot]

Da ich gerade selbst rumbastel und teste wie ich mit so wenig Code wie möglich auskomme, war mein Einwand möglicherweise unberechtigt, weil meine Minimalmaxime nicht auf deine Anforderungen übertragbar ist.
Sorry, hab eher „laut gedacht“ heut morgen.

 

[mastaqz]

Das normale Menü hat 10 Einträge. Das will ich aber nicht verschachteln. Für die mobile Version werd ich alles in 3-4 Einträge geben mit Dropdown...da müssen aber die Texteinträge anders sein als beim normalen Menü mit den 10 Einträgen...und somit geht es nicht ohne Umleitung und rein mit CSS.
Ist aber kein Problem, ist eh schnell gemacht.

Überlegung:
- 10 für Desktop View und 4 für Mobile View einbauen
- wenn Desktop View, dann die 10 sichtbar machen und die 4 unsichtbar
- wenn Mobile View, dann die 4 sichtbar machen und die 10 unsichtbar
- Durchführung mit 2 Klassen und einem Media Query

 

[LeanderAT]

Stimmt, danke!

 

[LeanderAT]

Ich komme gut voran, habe auch eine Lightbox ohne Javascript gefunden und eingebaut.
Eine Frage habe ich aber noch:

Kann es sein, dass CSS doppelt lädt?

Im Net finde ich zwei Beispiele mit min-width: 1800px und min-width: 900px...wenn ich die beiden Bedingungen reingebe mit jeweils Styles, dann wird anscheinend manchmal BEIDES geladen! Also wenn width=1920 ist, so sind ja beide Bedingungen erfüllt...min. 1800 und min. 900. Sind da min UND max obligatorisch, sodass kein Screen in mehrere Styles fällt?

Ich hatte nie Probleme...habe aber testweise bei einem der Styles einen temporären farbigen Hintergrund rein...der dann auch im anderen Stil geladen war, obwohl er dort gar nicht definiert war.

 

[LeanderAT]

Ich habe nun die Desktopversion fertig. Mobile kommt erst.

http://www.seelenpuls.at/hpneu/index.php

Wenn ich vier Media Queries verwende und alle min-width und min-height sind, kann das zu Problemen führen oder nicht?

@Media only screen and (min-width: 1px) and (min-height: 1px) -> Design 1
@Media only screen and (min-width: 980px) and (min-height: 600px) -> Design 2
@Media only screen and (min-width: 1143px) and (min-height: 700px) -> Design 3
@Media only screen and (min-width: 1437px) and (min-height: 880px) -> Design 4 (groß)

Hab mit allen Auflösungen getestet und bei mir funktioniert es!

Mit Design meine ich, dass in der CSS nur das Hintergrundbild anders ist und die px-Angaben für die Divs.

Geladen wird in der CSS immer die LETZTE zutreffende Angabe, richtig?
Hat jemand eine Auflösung, die nicht durch Design 2, 3 oder 4 aufgefangen wird, so wird Design 1 geladen.