ich habe ein Problem und zwar wird der ganz normale p Text vorne abgeschnitten in der Mobilen Version. Die ersten paar Zeichen fehlen einfach. In der Version am PC wird der Text allerdings ganz normal angezeigt. Die Mobile Seite ist mir aber fast wichtiger, da viele Kunden am Handy kaufen. Ich habe schon gedacht, dass die Bilder zu groß sind und der Text sich daher nicht lesen lässt, aber als ich eine neue Seite ohne Bilder und nur mit Text testweise erstellte, wurde der Text wieder nicht richtig angezeigt. Ich habe das Design “Supply” benutzt. Wie kann ich heraus finden, was ich im Code ändern muss, damit der Text normal angezeigt wird? Ich kann ein bisschen HTML und CSS aber meine Kenntnisse reichen dafür leider nicht aus.
Ich habe zum besser verstehen ein Bild angehangen. Links ist die Version vom PC, rechts die am Handy. Ich möchte bei der Handy Version auch nicht den “nach rechts scrollen”-Balken haben. Dieser ist aber auch da, wenn keine Bilder vorhanden sind.
mit einem link zur Seite liesse sich das ziemlich zweifelsfrei beantworten.
in Ermangelung ebendessen tippe ich darauf, dass das Header Bild breiter als der für den mobilen Inhalt vorgesehene Bereich ist, damit den Inhalt auseinanderdrückt und den Inhalt beschnitten darstellt.
die Lösung wäre entweder ein schmäleres Bild zu verwenden oder anhand entsprechender CSS-Regeln die Maximalbreite des Bildes entsprechend zu begrenzen, damit das nicht mehr passiert.
Danke, für die schnelle Antwort. Jedoch ist auch auf den Unterseiten, wo es keinen Header Banner gibt der Text so abgeschnitten.
Ich werde mal in den Code schauen, bezüglich des Header Bildes, denke aber nicht, dass das Problem ist.
im konkreten Fall ist der Output der Product Questions and Answers-App der Missetäter. Die Ergänzung des folgenden CSS-Blocks sollte das Problem lösen:
ich glaub, dass Szenario musst Du genauer definieren. Ich kann sagen, dass ich unter Chrome bei einer Breite von 300px auf der Seite https://elbe-welt.de/products/test-2 jetzt keine abgeschnittenen Komponenten mehr entdecken kann.
Ich habs gefunden. Es lag am grit Item container. Hab das im css geändert. Der war -30.
Fall jemand das selbe Problem hat, schaut mal im “product_template.liquid” rein.
