Hello,
I’ve got something strange happening when I use Page Builder to lay out blog post content. It seems that the more rows I use in the layout, the more whitespace is added below the post (see my test site here: http://agv.stoltzgroup.com/blog/recipes/vodka-gimlet/). What’s especially strange is that the whitespace is not appearing directly below the entry content, but below the comment form, which is not arranged by Page Builder or even part of the entry content.
I’ve done quite a bit of troubleshooting over the past several days. I’ve tried specifying 0 for bottom margin and padding in each individual row and widget, along with trying to force them in the CSS, with no success. The odd thing is that I can’t even identify where the space is coming from using browser dev tools–it doesn’t even really look like margin or padding.
I should mention that I’m defining the height of the entry content by the viewport height by assigning 100vh to the element. When I change the height in the css to “auto” or “100%”, the extra whitespace goes away. However, that’s not really an option because the layout and scrollbar positioning rely on using vh.
If anyone has any idea how to address this I would be so grateful.
Thank you!
Hi Areli,
I can’t seem to see why this is happening. Hm. Are you sure it’s related to Page Builder? I replaced the Page Builder data with a bunch of dummy data and the issue still occurred.
Maybe just throw in the towel and apply overflow: hidden to the body? With your setup, this is perfectly fine (and likely should be done anyway).
Hey Alex,
Thank you so much for the prompt reply. What’s bizarre is that when I was troubleshooting this issue last week, the extra whitespace was only appearing below posts where I used Page Builder…and now it’s showing up whether I use it or not. Clearly my site is haunted and Page Builder is not to blame.
I’ll play around with overflows on the body. Good thought.
Cheers!
Areli