Frage zu korrekter Schreibweise von media-queries in info-Datei
am 23.11.2014 - 12:03 Uhr in
Hallo zusammen,
ich bin auch gerade dabei eine Webseite responsiv zu erstellen auf Grund eines Subthemes von Zen.
Da ich einige Blöcke ausblenden muss auf dem Handy, da sie sich überschneiden habe ich in die Info-Datei schon eine Media Query eingefügt, was soweit auch schon funktioniert.
Jetzt möchte ich aber noch die orientation mit angeben etc.
Ich bräuchte jetzt die korrekte Schreibweise in der info-Datei, wenn das ganze dann im Enddeffekt so aussehen soll:
Ist diese Schreibweise richtig in der info-Datei: stylesheets[ media][(max-width: 20em)] and [(orientation:portrait)] = css/small.css
Kommt da das only dann mit ?
Und muss man nochmal zwei Eckige Klammern nach dem portrait machen [ ]?
Vielen Dank für Eure Hilfe.
Viele Grüße
Marita Betz
- Anmelden oder Registrieren um Kommentare zu schreiben
Hier sind erstmal ein paar
am 23.11.2014 - 16:07 Uhr
Hier sind erstmal ein paar Infolinks zu dem Thema:
http://getlevelten.com/blog/tom-nelson/three-ways-use-media-queries-drupal
http://www.elmastudio.de/programmierung/css/responsive-webdesign-mit-css...
http://blog.kulturbanause.de/2011/04/websites-mit-css3-media-queries-fur...
Das ist in dem Fall egal ob es sich direkt auf Drupal bezieht oder nicht.
Ich habe es ganz simpel gelöst indem ich in der info.datei nur eine zusätzliche mobile.css eingebunden habe.
Die Angaben erfolgen dann direkt in der mobile.css
Auch hier gibt es wieder viele Wege, wie immer...
Grüße Jenna
Danke Jenna für Deine Antwort
am 23.11.2014 - 20:58 Uhr
Hallo Jenna,
Danke für die Links.
Schade dass man auf dem Handy nicht Firebug oder so was ähnliches nutzen kann um dort die einzelnen Bereiche zu sehen.
Oder hast Du oder jemand anderes einen Tipp dazu?
Viele Grüße
Marita Betz
Barrierefreies Webdesign
Marita Betz
http://www.barrierefreies-webdesign-mb.de
Zitat: Schade dass man auf
am 23.11.2014 - 22:12 Uhr
Schade dass man auf dem Handy nicht Firebug oder so was ähnliches nutzen kann um dort die einzelnen Bereiche zu sehen.
Was möchtest du auf dem Handy sehen? Es gibt doch viele Responsive Testtools um jede Auflösung zu simulieren oder meinst du was anderes?
Grüße Jenna
Hi Maria, solche Tools wie
am 24.11.2014 - 04:25 Uhr
Hi Maria,
solche Tools wie Firebug hat es in den jeweiligen SDK's.
Im Android SDK (WebView) sowie XCode (UIWebView) sind Emulatoren
Debugger und Web Entwicklungs Werkzeuge enthalten mit denen man so
ziemlich alles einsehen kann.
MfG
Robert
https://awri.ch
Ich habe eine Schweizer Tastatur und daher kein scharfes ß ;-)
Ich suche etwas wo ich die einzelnen Elemente genau untersuchen
am 24.11.2014 - 17:45 Uhr
Hallo zusammen,
vielen Dank für Eure Antworten.
Ich suche etwas, wo ich die einzelnen Elemente der Webseite auf dem Handy (Smartphone) bei der Anzeige im Browser untersuchen kann. Also welcher CSS-Code da greift. So wie ich das mit Firebug am PC sehen kann.
Kann man das mit der Android SDK oder XCode machen? Die beiden Tools sind ja eher für die App-Entwicklung. Und XCode ist wahrscheinlich nur für Apple, ich arbeite aber unter Windows 8.1.
Die Programme wo die Darstellung auf den einzelnen Geräten simulieren, die kenne ich schon, z.B. Screenfly. Das ist nicht das Problem.
Ich würde nur gerne etwas hinter die Kulissen (also welche css-Befehle und css-Dateien greifen, welcher Bereich verursacht z.B. einen größeren Abstand etc.) schauen können, wenn etwas nicht so wie gewünscht funktioniert.
Ich hoffe es ist nun klarer, was ich suche.
Viele herzliche Grüße
Marita Betz
.
Barrierefreies Webdesign
Marita Betz
http://www.barrierefreies-webdesign-mb.de