Responsive Engine Row Layout Bug

Need help Responsiveness
1

Problem: With the responsive engine enabled, two shape elements create an unnecessary amount of space between each other when the page width is reduced. Unable to configure this space

Steps to replicate:

  1. Create a new blank project
  2. Enable the responsive engine
  3. Change page layout to row
  4. Add 2 squares 200 x 200
  5. Change the age width in the responsive tab

Expected behaviour:
When the page width is too small, the second square should align with the immediate row below the first square (without a gap)

Current behaviour:
The second square aligns below the first but there is a huge gap.

Video

1 Like
2

Check the Min height of the parent container (which might be the page in your case).

1 Like
3

I’m seeing this too.

Screenshot 2022-02-22 9.24.26 PM
Screenshot 2022-02-22 9.24.26 PM929×802 34.5 KB

4

It seems that reducing the page height fixes the issue. I don’t quite understand why when everything is aligned to the top.

5

Thank you, changed the page height to 200 seems to work that way

6

For me changing parent heights works in the editor but not on the actual page in the browser.