Using Run-Mode Rendering

I can’t seem to figure out how to have an image stretch to full-width. The link that is generated in the Dynamic Link (the S3 link) is present, with the ‘Insert Dynamic Data’ tooltip visible. Only by adding ‘Current Page Width’ do I get access to the Run Mode Rendering dropdown, but adding ‘Current Page Width’ (or anything to the S3 link) makes the image unloadable.

Run mode rendering is only useful when the image is dynamic. If it’s a static image, uploaded by you and with a URL from S3, why don’t you just resize the element to what you need?

What is a dynamic image?
What if we want something to resize to the browser size? A fixed-sized image won’t help.

A dynamic image is something that will look like, for instance, in the editor: ‘Current user’s profile picture’. Meaning you don’t know upfront what is the size of the image since it’s user-generated.

Resizing images with the browser is not something we support yet (it’s part of the responsive project). We do support this for the page background though, you can pick the option ‘Make image as wide as parent element’ (see https://bubble.io/reference#Elements.Page.backdrop_background_size_cover)

Alright, that makes sense.

Regarding the page background, the image stretches vertically all-page with ‘Make image as wide as parent element’. Can can we tackle just having images full-width, scaling within a relative height? Part of the responsive project? I’m sure many have inquired about this.

We’ll look at options there when we’ll work on responsive.