Elementor toont horizontale scrollbar op de smartphone

Probleem:

Elementor toont horizontale scrollbalk op de responsive website.Je hebt voor een WordPress website een homepage in Elementor gemaakt. Tijdens het testen van de pagina op de desktop zie je geen problemen.

De volgende stap is daarom om de Elementor pagina na te lopen op de tablet en smartphone. Sommige widgets wil je misschien anders tonen op een tablet of verbergen op een smartphone.

Nadat je dit hebt ingesteld bezoek je de homepage op jouw smartphone. Je komt tot de conclusie dat er een horizontale scrollbar wordt getoond terwijl dat niet de bedoeling is. Je kan de website van links naar rechts bewegen.

Je controleert de marges en paddings maar ziet niets vreemds. Het zou allemaal moeten kloppen. Als je het test op een smartphone met een breder scherm doet het probleem zich niet voor.

Oplossing:

Af en toe loop ik ook tegen dit probleem aan terwijl de marges en padding juist zijn ingesteld. De reden dat dit probleem zich voordoet is omdat er in de content een lang woord wordt gebruikt.

Dit lange woord kan gebruikt worden in een kop of in een teksteditor. Je moet dan denken aan woorden van 15 letters of meer. Natuurlijk is dit ook afhankelijk van het gekozen lettertype, dikte en grootte.

Heb je dus last van die horizontale scrollbar controleer dan de content. Zie je misschien op een regel een heel groot woord dat breder is dan het scherm? Dan is dat het probleem.

Je kan dit oplossen door in Elementor de lettergrootte voor de smartphone te verkleinen of meer ruimte links en rechts vrij te maken.

Alternatieve oplossing is om woorden met minder letters te gebruiken.

Laat een reactie achter

Your email address will not be published. Required fields are marked *

Deze site gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.