nicht angemeldet
css3 media query testen?
Matthias ApselGrüße,
ich habe eine sonderCSS für iPhone/iPad zu erstelln, besitze aber selbst keins der geräte - gibt es eine zuverlässige methode die css-mediaweichen auszuprobieren?
<!--[if !IE]>-->
<link type="text/css" rel="stylesheet" media="only screen and (max-device-width: 480px)" href="mobile.css" />
<link type="text/css" rel="stylesheet" media="only screen and (min-device-width: 768px) and (max-device-width: 1024px)" href="pad.css" />
<!--<![endif]-->
sollte zwar angeblich bei verschmälerten browser-fenster auch funzen, tut aber nicht. kennt jemand eine methode zum testen?
MFG
bleicher
-
Hi, Bleicher!
sollte zwar angeblich bei verschmälerten browser-fenster auch funzen, tut aber nicht. kennt jemand eine methode zum testen?
Das sollte nicht nur, sondern wird es auch - aber nur bei Browsern, die auch Media Queries unterstützen (IE9+,FF4+,...).
Gruß, LX
--
RFC 1925, Satz 3: Mit ausreichendem Schub fliegen Schweine ganz wunderbar. (...)-
Das sollte nicht nur, sondern wird es auch - aber nur bei Browsern, die auch Media Queries unterstützen (IE9+,FF4+,...).
Opera, Safari und Chrome ebenfalls - es gibt kaum einen modernen Browser, der das nicht unterstützt.
-
Grüße,
Das sollte nicht nur, sondern wird es auch - aber nur bei Browsern, die auch Media Queries unterstützen (IE9+,FF4+,...).
Opera, Safari und Chrome ebenfalls - es gibt kaum einen modernen Browser, der das nicht unterstützt.
der code den ich benutzt habe ist i OP - funktioniert bei kEINEM der browser - Op 11.5, FF6, IE9 - ich kann das fenster noch so schmal ziehen.
MFG
bleicher-
Om nah hoo pez nyeetz, bleicher!
der code den ich benutzt habe ist i OP - funktioniert bei kEINEM der browser - Op 11.5, FF6, IE9 - ich kann das fenster noch so schmal ziehen.
<!--[if ! IE]> /* lt wikipedia mit Ausrufezeichen */
aber: diese CC werden nur vom IE interpretiert, alle anderen lesen nur einen Kommentar. Das heißt nur der ie prüft ob er kein ie ist und führt dann den Code aus - ein Widerspruch.
Also lass die CC einfach weg.
Matthias
--
1/z ist kein Blatt Papier.
-
Om nah hoo pez nyeetz, Matthias Apsel!
<!--[if ! IE]> /* lt wikipedia mit Ausrufezeichen */
Quatsch! Wo ist die edit-Funktion? Ersetze "Ausrufe" durch "Leer"
Matthias
--
1/z ist kein Blatt Papier.
-
-
-
-
-
Grüße dich, bleicher,
sollte zwar angeblich bei verschmälerten browser-fenster auch funzen, tut aber nicht. kennt jemand eine methode zum testen?
Nein, sollte und darf es nicht. device-width bezieht sich, wie der Name schon sagt, auf die auf dem Gerät verfügbare Breite.
Nutze width um die Breite des tatsächlichen Viewports abzufragen.
Gruß, Daniel
-
Nein, sollte und darf es nicht. device-width bezieht sich, wie der Name schon sagt, auf die auf dem Gerät verfügbare Breite.
Opera "Mobile View" wählen, dann tut der Browser so, als wäre das Device tatsächlich so klein - damit lässt sich das auch gut testen. Horizontal Scrollen ist nicht fein, wenn das Layout beim Ändern der Größe des Viewports aber springt, ist das auch nicht cool - nein, sogar extrem verwirrend.
Die device-width abzufragen ist imho die besser Entscheidung, wenn es um das bedienen von Geräten mit sehr kleinem "Bildschrim" geht. Alle anderen bekommen ein teilweise flexibles Layout, welches sind an der tatsächlichen Viewportgröße orientiert.
-
Grüße dich, suit,
Opera "Mobile View" wählen, dann tut der Browser so, als wäre das Device tatsächlich so klein - damit lässt sich das auch gut testen. Horizontal Scrollen ist nicht fein, wenn das Layout beim Ändern der Größe des Viewports aber springt, ist das auch nicht cool - nein, sogar extrem verwirrend.
Gut zu wissen, das war mir noch nicht bekannt.
Ich selbst ändere meinen Viewport nur selten, aber ich wollte mich jetzt nicht für springende Layouts oder horizontales Scrollen aussprechen. Das überlasse ich dem Autor :)
Die device-width abzufragen ist imho die besser Entscheidung, wenn es um das bedienen von Geräten mit sehr kleinem "Bildschrim" geht. Alle anderen bekommen ein teilweise flexibles Layout, welches sind an der tatsächlichen Viewportgröße orientiert.
Da hast du meine volle Zustimmung. Ich wollte bleicher lediglich mitteilen, dass er bei device-width nicht erwarten kann, dass der Browser bei Viewport-Änderung Veränderungen anzeigt :)
Gruß, Daniel
-
-