Streaming live at 10am (PST)

Responsive design: how to make element symmetrical on all breakpoints?

Hi there,
my design is symmetrical and i hope that the clouds can move in an inverted V-shape throughout the different breakpoints as much as possible. I am okay if this isn’t possible in mobile but I was wondering if anyone can help me understand why the clouds on the righthand side are not moving responsively - leaving a lot of white space (on larger breakpoints) and being cut off (on smaller breakpoints)?

the clouds on the left seem to be doing just fine…or so i think…

appreciate any help at all! thank you so much!


Here is my site Read-Only: **Webflow - Clara's 2021 Design Portfolio Website

Hi @Clara_Chong I had look into your project and you can change your clouds to position absolute and set values with % or vw units.
example:
CleanShot 2021-03-30 at 22.25.19

after these settings clouds will keep proportional distance to viewport width, BUT there is a bit more issues to be looked after.