Page size same across all desktop sizes

Hello all!

I am making my FIRST ever bubble app… However, i’m running into an issue. I am using a bigger monitor (smaller tv) so it’s not going to be exactly 1920x1080 but I want my elements and page size to be good across all screen resolutions meaning the white bars on the side, and or the scroll going up and down isn’t necessarily there, and it all be done automatically? not have to use custom height and width if that’s even possible. I’m not sure if I explained this right but I got some pictures below to demonstrate.

1920x1080 Monitor
1366x768 Editing Monitor

Hope to hear back with feedback! Thanks in advance!

Learn the basics of responsive design in Bubble… then it will be simple.

Okay! How do I get started with that? Where can I learn that from and what do I specifically start at? Or just overall responsive design in general?

How do I get started with that? Where can I learn that from and what do I specifically start at?

Well, I’d start by reading the manual and associated tutorial videos:

Responsive design - Bubble Docs

(124) New Responsive Tutorials (2022) - YouTube

Or just overall responsive design in general?

Yes… you really need to get a good overall general understanding of responsive design (and specifically FlexBox, which is what the Bubble engine is based on)… otherwise you’ll just be going round in circles.

Once you understand the general concepts, it’s pretty simple.

most importantly your page is currently probably set to fixed width and it might help to change it to column.

then you can add groups and give them min widths, max widths [or not]
and put buttons and text inside.

[row container = things next to each other left to right]
[column container = things under each other up to down]