Horizontales Scrollen unterbinden

[Waegi]

Hallo,

Ich habe aktuell auf einer neuen Website das Problem, dass ich in der mobilen Version auf dem Handy horizontal scrollen kann, ich weiß jedoch nicht woher dieser Effekt kommt, ich hab schon mal alle Container versucht zu kontrollieren und zu sehen ob einer davon zu breit ist, das war jedoch nicht der Fall. Es bildet sich dann immer ein weißer Spalt am rechten Rand der Website, zu welchem dann gescrollt werden kann.

Die Website findet sich unter:

Vielen Dank schon für eure Hilfe.

Grüße Waegi

 

[noltehans]

Hi Waegi,

du hast width:1200px; UND max-width:1200px geschrieben.

<div id="layerslider_3" class="ls-wp-container" style="width:1200px;height:600px;max-width:1200px;margin:0 auto;padding:15px 0px;">
</div>

 

[Waegi]

Hallo, also wenn ich das ganze anpass auf auf width mit 100% und max-width:1200px, dann funktioniert das in der mobilen Version nicht mehr, der Slider wird dann nämlich viel zu hoch angezeigt und außerdem bleibt der weiße Rand immer noch stehen.

Trotzdem danke für die Antwort.

 

[Aelfry]

Ich habe aktuell auf einer neuen Website das Problem, dass ich in der mobilen Version auf dem Handy horizontal scrollen kann, ich weiß jedoch nicht woher dieser Effekt kommt,

Das liegt an zwei Objekten:
1) jedes h1 (.response) in deinen articles hat ein padding left/right, das zu der 100% Breite addiert wird
2) deine pagenavi (.wp-pagenavi) hat ebenfalls das padding Problem

Beides zusammen sorgt dafür, dass du mehr als 100% Breite und entsprechend eine horizontale Scrollbar hast.

 

[kleinestigerle]

Mit dem Befehl @media screen in einem css Stylesheet kannst du alle Parameter des Stylesheets für verschiedene Ansichtsgrößen/Ausgabemedien extra und detalliert definieren.

 

[FloriBo]

Hallo.
Hatte vor kurzem ein identisches Problem und bin nach langer Suche über diese Lösung gestolpert: Diese Eigenschaften deinem wrapper zuweisen.

#wrapper {

width: auto;
height: auto;
overflow: hidden;
padding: 1px;​

}

Wobei ich es gerade auch ohne padding ausprobiert habe und das funzte auch. Musst du mal testen ob es mit oder ohne padding besser für dich ist, bzw. alles funktioniert.

 

[Waegi]

@Aelfry: Danke, das hat einen kleinen Teil von dem Spalt gelöscht.

@FloriBo: Danke, das hat den restlichen Teil entfernt, jetzt passt es.

@kleinestigerle: Danke, hab ich ja verwendet, nur das ging trotzdem weg.

Danke an alle die geholfen haben.