Responsive Editor Element Change Widths differently

I have a page with a width set to 1200px…the page is set to not fixed width as needed to use the responsive design

I have a group that contains the content of the page which is set to a width of 1080px…it is also set to have a maximum width of 100% and minimum width of 20%. ( Group 1 )

Inside of that content containing group with width of 1080px is another group that has listing details…It has the same settings as the group it is contained within ( group 1 ), so maximum width of 100% and minimum width of 20%. ( Group 2 )

My expectation is that these two groups that have the same exact settings respond to page width changes in the same exact way, meaning the widths of those two groups will always be the same regardless of page width.

What is happening is that as I decrease the page width, the group that contains content ( group 1 ) is getting smaller at a faster rate than the group that has listing details ( group 2 ) which is contained in group 1.

In this screen shot, group 1 is selected. Notice how the orange boundary is less than the light blue boundary of group 2 ( which is contained in group 1 )

In this screen shot, group 2 is selected. Notice the orange boundary of group 2 is outside of the blue boundary of group 1 ( which contains group 2 )

So a couple of concerns here.

  1. Why would two groups set up exactly the same way respond differently?

  2. Why would a group that contains another group get smaller faster than the group inside of it?

Are you sure group 2 is actually inside group 1 and not just sitting above it? This may be the issue. I’d see no other reason for it doing this.

I had since changed some settings, so I can’t verify if this was the case or not, but I did make the group 2 smaller inside of group 1 and then expanded group 2 to fit the group 1 dimensions exactly.

The steps to do this

  1. Create group ( group 2 ) inside of another group ( group 1 )
  2. Set the X and Y coordinates of group 2 to (0,0)
  3. Set the width and height dimensions of group 2 to the same as group 1

Following these steps usually ensures my groups that are meant to be contained within another group are, so I am pretty sure the group was within it, but can’t verify 100% as sometimes things get moved a bit.

With that being said, why would a group that has the same x coordinate and width dimensions and responsive settings have the width decreased at a faster rate than the other? Because even if the group wasn’t contained within the other, the x coordinates were the same and all other things being equal they should move accordingly.

Not really sure the issue here. I am having other problems on the same page. Specifically the collapse element height when hidden isn’t working and filed a bug report on that as I can’t detect an issue on that. Might be a problem with the page itself, and I hope the response from bubble isn’t to delete and rebuild again.

The elements inside the groups could be to blame for it responding differently.

@lockymadera you got me thinking and I started checking through the groups but couldn’t find anything…

I finally looked at the element tree and saw a map element on page inside the first group that was hidden.

Same thing caused the issue with collapsing height.

1 Like

This topic was automatically closed after 14 days. New replies are no longer allowed.