Home App Docs Blog Github

Is there some way to make a Builder page expand its height to 100% of its parent?

Hi! I would like Builder pages to render to 100% of height of the page that they render within, in a case where its own content is shorter.

The use case is for situations where one might want to have page elements have background fill images that expand to the full page height, like shown here

I did some inspecting of the element and found that there are a number of divs that Builder introduces between the elements in the Page record itself and the site it is rendered within, and that these would need to have height: 100% set, as one solution. However, I don’t see a way to set that, and as these are all elements automatically created by Builder, I don’t think it would be possible / wise to create css on the site-side that styles them.

Is there some solution for this on Builder?

Hey @jballo, thanks for reaching out! For elements in Builder, you can set those 100% heights in the Style tab, but note that any external stylesheets used will override styling made in Builder.

It’s worth noting as well that in the organization settings, there is an option to remove the default margins added by Builder. Builder blocks typically have a 20px margin by default which you can remove.