Change entire site left and right padding with Elementor
-
I have an Elementor-powered Woodmart site. I’m trying to figure out a way to globally change the website’s left and right padding – every page, product page, post, etc. It seems like it defaults to 15px padding on both and left and right sides. I want to change that to a percentage value and I figured out how to do that with CSS – using body .container {padding-inline: 6%;}. But any container that has Container Stretch enabled and set to “Stretch to Container” ignores that above CSS, and the left and right paddings are all inconsistent as result. How do I get the containers to line up consistently? I don’t want to have to manage entire site paddings with every single container.
See the attached URL and the screenshot of the site.
Attachments:
You must be
logged in to view attached files.
Hello,
This is expected behavior. Containers with “Stretch to Container” ignore global padding. To keep content aligned consistently, you can either:
Use a boxed layout or set a custom site width for most sections, and adjust inner padding or you can adjust padding per stretched container using Elementor.
Global CSS cannot safely force padding on stretched containers without affecting full-width layouts.
Best Regards,