Full width page with elementor

Hi there,

1. I am designing a bespoke page with elementor and I chose page layout: elementor full width. I have also set the containers to full width (100%) but they are not as you can see.

2. How can I reduce this white space between the menu (grey line) and my hero banner?

Help please. Thanks a lot!

Hello Andrew S.,

Thanks for reaching to us.

To assist you in the best possible manner, I kindly ask that you please provide me temporary wp-admin info (wp-admin URL, username, password) to the Private Content area, this will allow me to thoroughly investigate and address your concerns more efficiently.

Regards,

Thanks a lot. see attached

Hello Andrew S.,

Thanks for details.

1. Try to use the Theme Preset feature of our theme for specific pages where you want to display in full width. Here is our documentation on how to use theme presets. https://xtemos.com/docs-topic/theme-settings-presets/

Then, go to Theme Settings > General > Layout and change the width https://prnt.sc/t3IcYr0LlV-3

2. Please add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

div.main-page-wrapper {
	margin-top: 0;
	padding-top: 0;
}

header.whb-header{
	margin-bottom: 0;
}

Regards,

Hi guys,

The page is already on full width settings and I’ve added the csss code and still nothing. You can see in the link below I shared.

Hello Andrew S.,

I fixed for you, please check preset’s settings https://prnt.sc/x6eUkKzty2_q

Regards,

Thanks Hung. There is still a small white space on the left and right of the video. I’m not sure we are at full width. Same for the green container beneath.

Attachments:

You must be logged in to view attached files.

Hello Andrew S.,

Thanks for your patience.

Please edit page via Elementor > select Section widget and set Stretch section https://ibb.co/YRLZrnR

Regards,

Isn’t that settting slowing down the page load? I would avoid doing it. Is there another way?
Cheers!

Hello Andrew S.,

Please add the below Custom CSS code to Theme Settings > Custom CSS > Custom CSS for Desktop:

.site-content.col-lg-12 {
	padding: 0;
}

Regards,

[Author]

Posts