Moblle Ansicht und interne CSS

Druckbare Version

08.07.2019, 10:11
the_dot

Moblle Ansicht und interne CSS

Hey ich hab mal eine ganz kurze Frage. Vielleicht hab ich auch einfach nur etwas übersehen.

Normal kann ich doch in ein Seitenlayout das interne CSS übernehmen. Ganz klassisch!!

Muss ich, wenn ich dies für eine mobile Version erstelle, irgendwas besonderes beachten, das das interne CSS verwendet wird?

Ich hab jetzt schon versucht, über den <head> Bereich das Stylesheets direkt einzubinden, aber mir wird einfach nichts angezeigt.

Mir werden zwar meine gesamten ID´s, Klassen und IMG angezeigt, aber mir fehlt halt einfach die Formatierung dazu!

Wie gesagt, muss man da irgendwas beachten? Eigentlich sollte das doch absolut kein Problem sein

Liebe Grüsse
08.07.2019, 10:18
planepix

Wo ist das Mediaquery definiert? Auch im internen Stylesheet?
08.07.2019, 11:16
the_dot

Genau!!

Mediatyp: Screen
(min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait)

und im Viewport:
width=device-width, initial-scale=1.0, user-scalable=no

Dank dir für deine Hilfe bzw. fürs lesen!

Gruss
08.07.2019, 12:09
tab

Wie testest du das? Deine media-queries mit min-device-width und max-device-width ändern sich ja z.B. beim Vergrößern/Verkleinern des Browserfensters nicht. Ich benutze eigentlich immer max-width/min-width.
08.07.2019, 13:06
the_dot

Ich teste das direkt am Endgerät auf einem iPhone 5 / 7 - aber später dann auch sicher mit anderen Programmen. Aber grundlegend gehts mir erstmal darum, das meine CSS überhaupt erkannt wird.
08.07.2019, 13:18
tab

Nuja, soweit ich weiss liegen diese iPhones nicht im Bereich 768-1024px für device-width.
08.07.2019, 13:36
planepix

Kannst du einen Link teilen, damit man das mal live ansehen kann?
08.07.2019, 13:53
the_dot

Zitat:

Zitat von planepix

Kannst du einen Link teilen, damit man das mal live ansehen kann?

Natürlich, die mobile Version ist noch online einzusehen: www.wechselstrommusic.de

Muss dann halt einfach das dementsprechende Endgerät genutzt werden :)
08.07.2019, 14:44
fusch

Hallo dot,

nur eine Randbemerkung: user-scalable=no finde ich (als nicht so ganz gut sehender Mensch) eine ziemliche Zumutung. Ich finde schon, dass es dem Anwender überlassen sein sollte, ob man etwas vergrößert. Seiten, wo ich das nicht kann, verlieren mich ganz schnell als Leserin ;)

Viele Grüße
Hella
08.07.2019, 16:39
the_dot

Zitat:

Zitat von fusch

Hallo dot,

nur eine Randbemerkung: user-scalable=no finde ich (als nicht so ganz gut sehender Mensch) eine ziemliche Zumutung. Ich finde schon, dass es dem Anwender überlassen sein sollte, ob man etwas vergrößert. Seiten, wo ich das nicht kann, verlieren mich ganz schnell als Leserin ;)

Viele Grüße
Hella

Hey Hella,

dank dir für das Feedback und den expliziten Hinweis. Finde ich als Ansatz sehr gut und werde ich sicher nochmal mit einfliessen lassen.

Normalerweise sollte es nur die eine Seite geben, das unsere Hörer von dort aus, auf die dementsprechenden Streamingportale kommen und mehr nicht.

Aber ich weis schon was du meinst und würde es eventuell in betracht ziehen.

Dank dir und liebe Grüsse

Sascha :)
09.07.2019, 10:59
the_dot

Liste der Anhänge anzeigen (Anzahl: 1)

Zitat:

Zitat von planepix

Kannst du einen Link teilen, damit man das mal live ansehen kann?

Kurze Anmerkung: Wenn ich die Media-Querys in die Style-Sheet Einstellung schreibe, nimmt er mir meine CSS raus. Wenn ich`s aber direkt in die CSS Schreibe, bleibt alles drin.

Kann mir das jemand erklären, bitte?

Danke

Anhang 22506
09.07.2019, 11:03
tab

Wie schreibst du das bei internem CSS direkt ins CSS
09.07.2019, 14:19
mlweb

Ich habe auch noch nicht so genau verstanden was Du genau wohin geschrieben hast. Mit einem Link direkt zum Problem wird häufig vieles klarer.

Nebenbei aber mal die Anregung vileicht besser externes CSS zu verwenden. Der interne css-Editor wird m.E. schon seit Jahren nicht mehr weiter entwickelt. Ist eher ein Relikt aus alter Zeit.
10.07.2019, 17:51
the_dot

Zitat:

Zitat von tab

Wie schreibst du das bei internem CSS direkt ins CSS

Hey Tab interpretiere ich das richtig, das du meinst wie ich das in <HEAD> Bereich schreibe?

Über ... Zusätzliche <head>-Tags hinzufügen als <style type="text/css">ID`s, Class, etc.</style>

und dann halt die einzelnen DIV´s ausformuliert. Hat aber nicht funktioniert.

Aber ich habe es jetzt hinbekommen.

Die Lösung dafür war das ich alles aus den Media-Querys rausgelöscht habe und plötzlich war mein Zugang zu der CSS da.

In den Media-Querys stand vorher nur, was ich vorher schonmal in einem Beitrag erwähnt hatte.

Ich weis, komisch, ist aber tatsächlich so.

Mobile Version funktioniert jetzt. Muss zwar noch optimiert werden, aber es ist auf einem guten Weg. Link zum anschauen steht ja oben, wer Interesse daran hat.
10.07.2019, 17:54
the_dot

Zitat:

Zitat von mlweb

Ich habe auch noch nicht so genau verstanden was Du genau wohin geschrieben hast. Mit einem Link direkt zum Problem wird häufig vieles klarer.

Nebenbei aber mal die Anregung vileicht besser externes CSS zu verwenden. Der interne css-Editor wird m.E. schon seit Jahren nicht mehr weiter entwickelt. Ist eher ein Relikt aus alter Zeit.

Wie schon gesagt, das Problem lag wohl eher irgendwo an meinen Media-Query Einträgen, das ich in der Ausformulierung irgendwie falsch lag.

Aber das mit den externen CSS würde mich noch sehr interessieren. Kannst du mir dazu ein näheres Bsp. geben??

Dankeschön mal an dieser Stelle an alle, die sich dem Thema und meiner Problematik gewidmet haben.

MERCI :)
10.07.2019, 18:48
planepix

Externes CSS ist dann ein CSS-Datei unter /files, welches du dann auch in der Dateiverwaltung direkt editieren kannst oder mit einem externen Editor.

Und dann bindest du diese externe CSS-Datei über das Seitenlayout ein.