Op de mobiele versie van mijn website sherkappers.nl kan ik mijn website naar links schuiven en dan krijg ik een lelijke rand te zien.
Als ik op andere pagina's kijk dan gebeurt dat niet. Dit is gemaakt in Elementor. Iemand een idee waar dat aan kan liggen?

Ik heb dit niet op mijn mobiel.

Alleen als ik klik op Boek een afspraak is hij lelijk wit.

Ik heb dit wel en als ik op BOEK EEN AFSPRAAK klik dan kan ik een afspraak maken. Ik krijg dus geen lelijk wit iets

Ik heb hetzelfde zoals Peter. Ik kwam erachter dat het waarschijnlijk in de sectie zit met als tekst: “

WIJ KLEUREN HET HAAR MET HET PROFESSIONELE EN MEEST GEBRUIKTE MERK GOLDWELLl”

Als je die sectie op 92% zet, heb je die uitstekende div niet meer, maar dan ziet het er niet meer uit. :-) Het nadeel van Elementor.

Origineel gepost door Dennis de Wit

Ik heb hetzelfde zoals Peter. Ik kwam erachter dat het waarschijnlijk in de sectie zit met als tekst: “

WIJ KLEUREN HET HAAR MET HET PROFESSIONELE EN MEEST GEBRUIKTE MERK GOLDWELLl”

Als je die sectie op 92% zet, heb je die uitstekende div niet meer, maar dan ziet het er niet meer uit. :-) Het nadeel van Elementor.

Niet per se een nadeel van Elementor, het probleem van OP komt vaker voor bij pagebuilders icm bepaald thema. Het is simpel op te lossen met een fix. Voeg deze custom CSS toe aan je pagina:

Code:

html {
overflow: hidden !important;
}

Daarna verschuift het niet meer. Deze instelling kan ook in Elementor zelf sectie/rij aangegeven worden.

Ik heb je code toegevoegd maar dit loste het probleem niet op. Ms zet ik het op de verkeerde plaats? Waar kan ik dit het beste plaatsen?

Ik heb de code getest en hier werkte het. Je kunt dit aan de Custom CSS via customizer toevoegen of aan de Elementor pagina (beste optie): in de linker balk van Elementor linksonderaan op het tandwieltje klikken > Geavanceerd en daar staat een Custom CSS box.

Daar had ik het al geplaatst en deze met en zonder !important want daar gaf die een melding over. Het resultaat op mobiel was hetzelfde. Praten we over hetzelfde probleem? Ik heb een filmpje geplaatst met het probleem: pedemo.nl/sher.mp4 (je ziet daar een andere testsite maar ik heb ingevoerd op sherkappers.nl)

We praten over hetzelfde probleem inderdaad :-)

!important wordt soms een melding over gegeven maar kan geen kwaad. Cache ook geleegd? Ik zie nu nl dat je scroll helemaal niet meer werkt (verticaal), probeer deze eens:

Code:

@media only screen and (max-width: 768px) {
 .elementor {
    overflow: hidden;
}
  }

Top deze werkt helemaal goed, thanks!

En dat is absoluut niet de juiste manier om te doen. Met overflow:hidden valt alles weg dat er buiten valt. Dat kan soms voor hele lelijke tafereeltjes zorgen. Niet doen dus, als je niet weet waar je mee bezig bent.
Dit is echt weer zo'n trutten oplossing, jammer, ik had toch wel wat betere reacties verwacht dan dit.

Het probleem zit in je pagina opmaak in het social media blok en met name de e-mail link. Net boven "Hoe beoordelen klanten ons". Deze box heeft een margin: -48px -48px -48px -48px Deze moet je op 0 zetten.
Voor details zie:

.elementor-9 .elementor-element.elementor-element-ad8817c > .elementor-widget-container {
margin: -48px -48px -48px -48px;
}
Dit is de boosdoener en die heb je blijkbaar zelf veroorzaakt met elementor.

Als je dit bijvoorbeeld wilt overschrijven met css gebruik dan eens.
body.home .elementor-9 section .elementor-element.elementor-element-ad8817c > .elementor-widget-container {
margin: 0;
}
Als het goed is overschrijf je het zo zonder !important te gebruiken maar dat kan ik niet testen.

Het is geen fout van Elementor al hoewel het een waardeloze pagebuilder is. Waarschijnlijk is dit wel wat de website zo vreselijk langzaam maakt.

Succes...