Forum Academy Marketplace Showcase Pricing Features

How do I set height to 100% vh?

Hi,

I’d like to set the page height for a login page I’m designing to be 100% so that there’s no vertical scroll on the page. Is there a way I can do this in Bubble?

Thanks.

Hey @SeanB :wave:

Can you share a screenshot (or a link) so I can see exactly what you are trying to do and why it’s not 100% already? Maybe it’s just shortening the page height that will fix it.

Thanks for looking at this @J805

Here are a couple of screenshots of how there’s whitespace when I preview.

I apologize because I should have been clearer in my original question because it’s not that the vertical scrollbar shows up by accident, instead it’s because I set the page height to 1042. So I could simply just resize the page height to 400 or something, since this page only needs to include this Add New User content. The thing I’m trying to figure out is, can I not just set the page height to 100% of the whatever is the viewport height without having to define the exact pixel height. The reason I’m curious about knowing this is because I use one 32" monitor and another 27" monitor and so I didn’t want to define the height for this page (and other pages like this) based on a set pixel height, but rather to 100% of of whatever it is the browser height is.

Any insights would be much appreciated.

Thank you.

This is a long thread that discusses what you want to achieve. You’ll need to use JavaScript and edit the page header to target the element you want to size.

Hey @SeanB :wave:

If you just make the page as short as the element, it won’t scroll no matter what the screen size is.

There are plugins that help you do this, I rarely have to use them though.

Are you trying to make an image the full height of the screen or something? If that is the case, you can use this toolkit plugin and use the element called hero sizing.

Hope that helps! :blush:

@j805 www.NoCodeMinute.com

For All Your No-Code Education Needs:

  • One-on-One Tutoring
  • eLearning Hub
  • Video Tutorials
1 Like

Perfect! I guess that’s what I had overlooked. Simply make the page height the height of the element and it won’t go beyond that.

Thanks a ton. Really appreciate it. :slight_smile:

1 Like

No problem. Glad that helped! :blush: Keep up the good work. :raised_hands: