Site logo

Archived topic

White bar at bottom of page

25 replies · Started by Peter on July 15, 2019

Viewing posts 16–26 of 26

I had tried to find the <p> tag and remove it already, but I could not find it in the code/content of the footer test page. I removed it in DevTools by editing the HTML there, but that did not remove the white bar.

I managed to get rid of the <p> tag now by putting the image in a

, but the white bottom bar is still there.

Oops, the last sentence should be:

I managed to get rid of the <p> tag now by putting the image in a <div>, but the white bottom bar is still there.

Hi there,

the space is appearing because of the vertical alignment of the image. So if you wrap your image in a DIV with a class eg.

<div class="footer-image">
<!-- your image tag in here -->
<div>

Then this CSS to align the image to the bottom:

.footer-image img {
    vertical-align: bottom;
}

Thank you David,

I tried it now but it still does not work. Can you come up with another solution?

Hi David,

That's strange. Have you tried to clear your cache? I can see that the changes are added.

Screenshot

I can't see the CSS? Where have you added that?

It is in the right column in DevTools:

.footer-image {
    vertical-align: bottom;
}

I added it in Appearance\Customize\Additional CSS. Or have I misunderstood something?

That CSS is incorrect - check above

Thank you for your sharp eye, David. I added the "img" as well, and then it worked! That was just a test page without Beaver Builder though, because Leo wanted to troubleshoot without Beaver Builder activated. When I reactivated Beaver Builder now and tried to recreate the footer, the white bottom bar actually got bigger ... But by some crazy logic I changed the "vertical-align: bottom;" to "vertical-align: top;" for the footer image instead, and that worked. I don't know why.

That is odd. Glad you got it resolved.

This archived topic is closed to new replies.