Change image size for different screens

Hi Bubblers!

I’m learning to build with Bubble and trying to create a responsive header.

I want the logo to change to a smaller size when the screen gets smaller.
In CSS we use the Media switch option.

I’m trying to do something similar with Bubble, and I can see that the image “condition” tab allows me to change some styles of the element according to the “current page width” - But not the height or width… :confused:

Any tips on how I can achieve this?


Hi !

I would say the easiest is to just put different images with different sizes and then set some visibility conditions based on page width.

I don’t know about more elegant solutions :slight_smile: