Meine mobile Website wird horizontal scroll

Question

Im makin 'eine mobile Website für einen Freund - und ich benutze Medienabfragen, um ihre Website für ein mobileres Gefühl anzupassen, wenn Sie es auf einem Smartphone zu sehen.

Fühlt sich an wie ich mit der Webseite fertig bin - aber wenn ich es auf meinen Handys iphone 3gs und htc incredbile S sehe es so, dass Sie 2-3 Pixel horizontal scrollen können. Irgendein Element ist mit diesem und dem wachsenden grauen Haar unordentlich, da ich nicht wirklich herausfinden kann, welches es ist.

Wie löse ich das?

Homepage Link

http://www.linaahlen.se/

Answer 1

Hatte einen kurzen Blick mit dem Inspektor in Chrome und es sieht aus wie es diese Eigenschaft ist:

div.entry { 
    padding: 0em 1em; 
} 

Linie 106 von Stil-responsive.css - es drängt der Inhalt nur ein paar Pixel breit, änderte es zu padding: 0 0.8em; gearbeitet für mich.

Oh, und nur für die Aufzeichnung, es ist horizontal, nicht vertikal scrollen!

Answer 2

Spät, aber für zukünftige Referenz. Ich möchte auf den Weg zur Suche nach der Ursache für das Problem hinweisen. Öffnen Sie die Website mit Google Chrome Device Mode. Überprüfen Sie dann, ob das Problem dort besteht (diese Lösung beruht darauf, dass das Problem im Gerätemodus angezeigt wird). Beginnen Sie dann mit der Einstellung "display: none" auf die Elemente, beginnend mit größeren Elementen wie Header, content container und check nach dem Ausblenden jedes Elements, wenn die unerwünschte Scrollbarkeit verschwunden ist. Auf diese Weise können Sie die Ursache des Problems aufspüren.

Ich hatte das gleiche Problem und versuchte zuerst die Ursache zu identifizieren, indem ich den CSS-Code jedes einzelnen Elements betrachtete, viel Zeit verschwendet und die Ursache nicht gefunden hatte. Wahrscheinlich kann ein Browser eine Seite besser rendern, als dass ein Mensch CSS liest ...