Forum Academy Marketplace Showcase Pricing Features

New responsive engine won't collapse height?

Need help Database
#1

Building a SPA requires that each group (page) must be shown/hidden. Because some groups will be taller than others, we need to collapse the height to fit each groups height which is easily done in the old engine, simply add a group underneath the content which is hidden and collapsed.

Am I correct in thinking that the new engine can not collapse in this way? For example, make you index page 1000 high and add a hidden and collapsed group 500 high, on preview you should see the index page as 500px high but it seems to remain at 1000 high with the new engine.

How can we create a SPA with the height shrinking to fit content in the new engine?

#2

The best way is to set your min height to 0, and allow the content to fit content to height.

#3

Complementing @GhostCodes great advice.

If you want to be able to click the element on the editor set it to say… 10 instead of 0.

10 is pretty much the same as 0 in this context

1 Like
#4

There’s no need to do any of that in the new responsive engine… just add your groups as you need them and check the ‘collapse when hidden’ box. Job done.

#5

Worked perfect, thank you!

#6

This didn’t work because, although the groups do collapse the main index page does not shrink to fit what ever content is showing. In the old responsive engine the index didn’t have a ‘minimum’ height value so it did collapse.

1 Like
#7

I must say, the new engine is very good … I’ve been resisting the change for ages but it seems well worth it :slight_smile:

1 Like
#8

I don’t want to push my luck with the new responsive engine, I am blown away at how good it is so far, it’s so robust - the Bubble team are literal geniuses (or is it genii!?!)

Question; is there a way to make buttons stretch to fit the button text?

#9

Just use ‘fit width to content’

#10

No joy …

fww

#11

You’ve got it set to ‘fixed width’ (which means its width won’t change)…

If you want its width to fit the content, deselect the ‘fixed width’ option, then you’ll see the additional responsive options - so select ‘fit width to content’ (Obviously check your min and max width settings as well)

1 Like
#12

Ah true! Thank you, it’s working now :slight_smile:

1 Like