Hallo zusammen,

das Theme Stockholm sieht ganz wunderbar aus. Nur die mobile Optik hat ein paar Defizite, die ich gerne anpassen möchte:

- die Schriftgröße der H1-Tags nur in der mobilen Ansicht anpassen. Folgendes hat leider keine Wirkung:

@media (max-width: 768px) {
   .h1 {
    text-size:13pt;
    }
}
 
 

- den Header-Bereich in seiner Höhe anpassen (ebenfalls nur in der mobilen Version)
- Elemente in der mobilen Version ausblenden

Vielleicht hat jemand ein paar Tips oder Ideen.

Vielen lieben Dank
Christian

Ganz lieben Dank!
Habe alle Punkte lösen können und nun noch eine Frage, die in diesen Thread gut passt.

Ich habe eine Tabelle mit vier Spalten erzeugt. In der mobilen Ansicht wird die erste Spalte komplett angezeigt, dann die zweite, dann die dritte und dann die vierte. Ich möchte aber in der mobilen Ansicht zwei statt nur eine Spalte angezeigt haben. D.h. zwei Spalten nebeneinander.
Über Tipps freue ich mich sehr.

Vielen Dank und Grüße aus Berlin
Christian

Ist ja auch sinnvoll, dass nur eine angezeigt wird. So ist es für den Benutzer auf dem Smartphone einfacher zu lesen.
Es gibt keinen Grund 2 Spalten haben zu wollen.

Woher weißt du, ob es keinen Grund dafür gibt?

Es ist immer fallbezogen zu bewerten und für meinen Shop ist diese Änderung sehr sinnvoll. Produkte werden in Tabellen strukturiert und es sieht optisch wesentlich besser aus, wenn mobil zwei Produkte nebeneinander dargestellt werden.

Zitat

---

Ich habe eine Tabelle mit vier Spalten erzeugt.

---

Ich denke die Tabelle ist das Problem. Tabellen bleiben Tabellen, auch auf mobiler Ansicht. Vielleicht wäre es besser, die ganze Sache von vornherein mit Spalten zu lösen, dann kann das Gerät entscheiden wie viele Spalten es zeigen will ...

Und auch gut wäre, wenn wir wissen, wovon wir sprechen (URL?)

LG
SG

Vielen lieben Dank für die Antwort.
Ich kann die Produkte gerne aus der Tabelle lösen - was gibt es für Alternativen?

www.skanemarie.de (auf eine Unterseite gehen)

Viele Grüße

Kleiner Nachtrag: Es handelt sich bereits um reine Spalten.

Ich brauche da auch noch mal Hilfe. Ich wollte die h2-Tags in der mobilen Ansicht anpassen. Design habe ich ich "Rome".

Im Header füge ich folgendes ein:

<style type="text/css">
/*<![CDATA[*/
/* h2 ueberschrift in der mobilen ansicht */ 
@media (max-width: 767px) {
   .h2 {
    font-size:20px;
    }
/*]]>*/
</style>
 

Keine Reaktion. Habe hinter

font-size:20px;
 

auch noch eine zweite Klammer eingefügt, also:

<style type="text/css">
/*<![CDATA[*/
/* h2 ueberschrift in der mobilen ansicht */ 
@media (max-width: 767px) {
   .h2 {
    font-size:20px;
    }}
/*]]>*/
</style>
 

Aber eigentlich müsste die zweite Klammer eh falsch sein. Aber wieso kriege ich in beiden Fällen den h2-Tag in der mobilen Ansicht nicht in 20px angezeigt?

Hier der Link zu meiner Webseite:

Meine Testseite

Bereits jetzt Danke für die Hilfe.

LG, Sigi

Einfach mal hinter die 20px ein !important setzen sollte wahrscheinlich schon das Problem lösen...

Also:

font-size:20px !important;
 

Gruß
make

Funktioniert leider immer noch nicht.

Wußte gar nicht, dass es so etwas gibt. Schaue ich mir am Wochenende mal an.

Leider funktioniert es immer noch nicht. Noch nee Idee?

Also ich habe den Code von _az (#13) über die FireFox Enwicklerwerkzeuge mal in den Head Deiner Seite eingefügt. Da erzeugt er genau den Effekt den du erwartest.

Auch in der mobilen Ansicht werden danach die 20px Schriftgröße verwendet!!!

Hast Du alles korrekt eingefügt?

Also, ich fasse es nicht. Jetzt geht es.

Was habe ich gemacht?

1. Ich habe mir mal den ganzen css Kram aus dem Header kopiert und gesichert. Da hatte ich den Code von _az(13) aber raus gelassen.
2. Dann habe ich den Code von _az(13) in den Header eingefügt.

Ergebnis: Funktioniert!

Aha, dachte ich. Dann wird es an irgend einem Konflikt im gesicherten Header geben. Da kam der h2-Tag zweimal vor.

Denkste.

Ich habe den kompletten gesicherten Header-Code noch einmal zurück kopiert und mit dem Code von _az(#13) ergänzt und gespeichert.

Und seitdem funktioniert es. Keine Ahnung warum. Vielleicht doch was falsch eingefügt? Mhhhh. Ich kann es nicht erklären.

Damit ist meine Frage perfekt gelöst. Juhu!

Vielen Dank für eure Hilfe.

Hallo hazelnat,

ich habe das gleiche Problem mit dem Header auf der mobilen Ansicht. Wie hast du es geschafft dass das Bild größer angezeigt wird (also eine größere Höhe hat)?

Vielen Dank für die Hilfe im Voraus.

Liebe Grüße