Site Scrollando: 3 Formas de Como Remover a Barra de Rolagem Horizontal no Elementor

Aprenda neste tutorial WordPress Elementor, como corrigir o erro da barra de rolagem inferior horizontal no site criado com WordPress, WooCommerce e Elementor. Muitas das vezes quando criamos um site com o Elementor, o Layout ficar com aquela barra de scroll horizontal, na parte inferior do site, isto é, scrollamento horizontal.

Dessa forma, quando alguém rola o site para a lateral, aparece a barra branca lateral(espaço branco na lateral do site), e isso é um erro que precisa ser corrigido tanto na versão do site em Desktop, quando na versão Mobile.

Quem trabalha criando sites com o WordPress, Elementor e WooCommerce, já deve ter passado por situações em que o layout do site tenha ficado com uma barra lateral branca(vazia), ou seja, o site ficou com uma barra de rolagem na parte inferior. Isso acontece principalmente em seções criadas com o Elementor, em que foram configuradas como Largura Total(Foram esticadas) e o desenvolvedor do site colocou margens negativas para ajustar algum elemento como imagem à extremidade da página.

Ou quando usa algum plugin ou Addon para o Elementor e essa funcionalidade “passa” da tela na versão Mobile do site. Ou mesmo pode acontecer da barra de scroll(barra de rolagem inferior) aparecer por algum bug/erro de algum plugin ou erro de configuração. Por isso assista esse vídeo das 3 Formas de Como Remover a Barra de Rolagem Horizontal no WordPress e Elementor [Site Scrollando]

body, html {
overflow-x: hidden !important;
}

/Corrigir escrollamento no Mobile/
@media (max-width: 786px){
body, html {
overflow-x: hidden!important;
}
}