3 Methods to Fix Elementor Full Width not working (No.2 is Super Simple)

Quick Note: No additional elementor addons & pro version required. You can fix the elementor full width not working in the free version as well as the pro.

So you already know the definition of the Elementor full-width page & using it instead of the Elementor canvas layout.

If not then here’s a quick explanation…

An Elementor full-width page means the content stretches from right to left and takes 100% of the screen width while displaying elementor created content along with your website header, footer & sidebar (if enabled)

But unfortunately, the page isn’t set to full width & the editor isn’t extending to the full width of your screen. Several factors from theme settings to single-page layouts can cause the issue with properly creating a full-width page.

Well, no worries as I've shared 3 methods that will help you fix the elementor full width not working issue in minutes.

Let’s keep things simple & start from the basics…

Method 1: First & foremost, Cross check the Post & Page attributes inside the Elementor editor & set the page layout as full-width

If your theme does not support a full-width layout, you may experience this issue & to override the settings, you’ll simply need to enable a full-width page layout inside the elementor editor.

To do this, simply click on the little gear icon in the left corner to enter the page/post settings. 

Next up, right next to page layout options, select the Elementor full width from the dropdown & then click on update to save the changes as shown in the video below…

Once done, check your page in a new tab or better to check in an incognito window (just to avoid caching issues) & see if the problem is solved or not.

If yes, voila!

You can get back to work & if not, stay with me & follow the second method.

Method 2: Try making a fresh start but an easy one to fix the elementor full width not working issue

Sometimes the simplest-looking things are the most effective ones.

I’ve experienced several issues with Elementor editor, be it the full-width issue, server error issue, or setting the accordion widget to start closed & whatnot.

And whenever I face this issue, this is the simplest thing to do…

Step 1: Create a New Page with Elementor

Step 2: Before doing anything inside the editor, Set the page layout as “Elementor full width” from the page settings

Step 3: The last step is to simply copy all the content from your old page to the new one & hit update. This works like a charm. So give it a try.

Here’s a quick video tutorial for the same that you can watch at 1.5x speed…

Method 3: Try the Canvas layout & manually set up headers & footers

If both of the above methods didn’t work then the last known method is to simply set the page layout to “Elementor canvas layout”.

In both the elementor full-width & canvas layout,  the content stretches from right to left and takes 100% of the screen width.

But the only difference between the elementor canvas and the elementor full-width layout is the canvas layout won’t show your website header, or footer while the full-width layout will display elementor created content along with your website header, footer & also the sidebar (if enabled)

So, if you’d like to have your website header & footer, then simply copy & paste your header & footer section (if created with elementor page builder)

To conclude…

For your elementor-created page, set the page layout from the page/post settings to “Elementor Canvas”.

This will result in a full-width layout & will erase your site header & footer.

Next up, 

If you want your site header & footer to be on this page & if you have created your website header & footer with an elementor, simply copy-paste the header & footer sections to this elementor page.

This way, you've your site header, and footer & the page layout is also full-width.

Lastly, if you don’t want your site header & footer on this elementor page then there’s nothing to do.

By now, you should have successfully fixed the elementor full width not working issue.

Now take a min & drop a comment to let me & others know which method worked for you. It will encourage me to create more content for elementor users just like you.

Also, give it a share if you think this tutorial might be helpful to other elementor users.

More Elementor Tutorials:
1) How to set the Elementor Landing page as Homepage
2) How to set Elementor accordion closed by default
3) How to add custom fonts to Elementor
4) How to add iFrames in Elementor