Streaming live at 10am (PST)

Help with Positioning and Unwanted Smooshing

Hullo, Flow-ers!

I’m currently building a website for a water bottle. This particular page is proving to be beyond my current ability, so I’m looking for a bit of help.

Here we have three images of different parts of the bottle. Each of these is placed within a Div (set to “Relative” position) that also has these red markers on them (also set to “relative”).

You can see that this particular section isn’t appreciating becoming smaller. The bottle remains the same size, but the top and bottom images scale smaller as screen size shrinks. Some red markers retain their position relative to the Div, and others do not.

Does anyone have a better way to approach this project so that it doesn’t smoosh and crimple?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey @wafflaffle

Could you share your read only link please. :slightly_smiling_face:

You’ve shown what you don’t want to happen, which is great, if you could let me know what you’d like to happen when the screen size is reduced and I’ll do my best to help. i.e do you want it to stay all the same but scale down relatively etc.