-
Posts
-
Hello.
I have started building a new website in Enfold, which I’ve used quite a few times before.Because the client wants a very specific footer, I’ve decided to use the “page as footer” option.
However, you will see from the link, that for some reason it’s added a huge amount of padding to it.I’m not very good with code, but I can see this has been added when I inspect the page.
.html_header_transparency #top .avia-builder-el-0 .container, .html_header_transparency #top .avia-builder-el-0 .slideshow_caption { padding-top: 116px; }Can you please help? Is it because the page is blank?
Thanks in advance.EDIT: It seems that this happens when the header is set to transparent. The client has approved the site with a transparent header, so this will need to stay.
Please help!!!!EDIT2: It seems like this fixes the issue, but I’m not sure about coding, so can someone please clarify if this might break something else down the line.
.html_header_transparency #top .avia-builder-el-0 .container { padding-top: 0px!important; }
@yigit are you there!?!Hey jonrouse,
On the footer page, can you edit the Color Section then change Section Padding to No Padding or Small Padding.
Hope this helps.Best regards,
NikkoHi Nikko
Thanks for the reply, but you can’t see the issue because I used the code below:.html_header_transparency #top .avia-builder-el-0 .container { padding-top: 0px!important; }I’ve attached a link to a screen grab so you can see what it looks like without the code. By default it is adding 116px padding to the top.
My main concern that I have added this code and I want to be sure that it isn’t going to create problems down the line. The only CSS I know has been learned by using enfold!Hi jonrouse,
Yes, I see that base on the code you gave, however it does affect 2 areas, 1 in the footer and the 1st section/layout element in the current page.
I think instead of using the code that option I posted is available for use.Best regards,
NikkoThanks Nikko,
Unfortunately that doesn’t work – I’ve commented out the code and you can see the effect it has had there.
The content of the footer is now at the very bottom and when I inspect the element I can still see that it says.html_header_transparency #top .avia-builder-el-0 .container, padding-top: 116px;It seems like having a transparent header makes this happen, because when I turn transparency off, the problem goes away.
Hi,
Go to the footer page, and it the Color Section there’s this field For Developers: Section ID put myfooter then on Quick CSS (located in Enfold > General Styling) add:
#top #wrap_all #myfooter { padding-top: 0px!important; }Let us know if this helps.
Best regards,
NikkoThank Nikko, didn’t work, but I tried changing it to:
#myfooter .container { padding-top: 0px!important; }Is that okay to use?
Hi jonrouse,
Yes, that’s the right selector to use, I forgot to include .container.
That should only affect the custom footer page’s color section.
To improve the code a little bit you can use:#myfooter .container { padding-top: 0 !important; }Best regards,
Nikko
- The topic ‘Huge padding on footer’ is closed to new replies.