As a website developer, have you ever had issues with gaps appearing between the footer section and the bottom of the page on WIX websites?
Here is a quick guide to solving the issue and prevent future occurrences.
Steps to Fix the Gap
- Check page container height
- Check page elements
- Check page setup
- Check page break
1. Check page container height
Check the configured height of your page container. This can be adjusted in the Page Settings section of the WIX editor. A higher height ensures that the footer is pushed to the bottom of the page.
2. Check page elements
Go to the Design tab of the WIX editor. The page footer may be affected by elements on your page. Make sure to add margins to page elements and adjust their position, so they don't overlap with your page footer.
3. Check page setup
Check the page setup settings in the Design tab. Make sure that the page layout and page adds the height of elements to its depth.
4. Check page break
If there is a page break, the footer may be affected. It’s recommended to avoid page breaks on the page in order to fix the gap.
FAQs
What is a page container?
A page container is an element on your website which holds all the elements of the web page. It's possible to adjust the height of the page container in the Page Settings section of the WIX editor.
How to add margins to page elements?
Adding margins is quite simple. In the Design tab of the editor, click on the element you would like to adjust, select the “Margin” option and apply the settings to the element.
How to adjust element’s position?
Adjusting an element’s position is just as easy as adjusting the margin. In the Design tab of the editor, select the element which needs to be adjusted, select the “Position” option and adjust element’s position.
What settings to check in page setup?
In page setup settings you need to check the page layout and page settings options, in the Design tab. Make sure these two settings add the height of elements to page’s depth.
How to avoid page breaks?
To avoid page breaks, in the Design tab of the editor, select the Page Break option and set it to “Off”.