Trying to wrap my head around the new responsive engine.
Could anyone help with an example of how to make Bubbles Starter Template responsive? (the default template when you make a new app).
Specifically the hero section.
This is how it responds in old responsive engine
- In desktop view it has a hero section, two columns, text on left side and image on right side (great!)
- At around 950px page width, the image breaks to the next row (great!)
- In mobile view (around 350px), the text and image still looks great and responds to the width (great!)
New Responsive Engine
In the new responsive engine I seem to have to make a trade-off between the elements fitting to a small mobile screen OR having it break at e.g. 950px.
- If the two columns are set to min width of e.g. 320px, then it looks right on mobile but is not breaking at 950px.
- If the two columns are set to min width of e.g. 450px, then it breaks at around 950px, but doesn’t like right on mobile
What am I missing?
See the public editor here: Question-public | Bubble Editor