Is there a way to collapse width?

Need help Responsiveness
22

I was thinking the same @brett.miles

btw I’ve completed the work for 2 icons :slight_smile:

you can hide or show the 2 icons in any combination you want. I created a custom state and the value changes based on which icons are showing and I set the element id based on the state. I also assigned negative margins to the element ids however this approach needs you to create a state based on any combination that the icons can appear.
My solution does not collapse the container width however @sean mentioned that in his case it is not required.

I also added a text that toggles each time an icon is clicked. I added to see if the negative margin affects the element but it doesn’t. This means that I don’t need to add any class to the parent of the icon with JS. Only pure CSS and negative margins to the icons. You can still click on the icons and they’re functioning as expected.

2 Likes
23

I like your solution. Can you give an example please?

24

can you provide us with the editor link?

25
2 Likes
26

This is a rough example of what I was talking about - utilising the horizontal columns of a RG

Editor:

4 Likes
27

This works. Thanks.

28

Thanks for your help. I think I’ve got it working now.

1 Like
30

Rejoice – This is now possible, very easily, with the new beta responsive engine. Goodbye hacks. Excuse me while I delete 50 lines of crap javascript…

2 Likes
31

Hello,
Can you please explain how u were able to get it done.
Thanks in advance

32

Hello,
Can you please explain how u were able to get it done.
Thanks in advancequote

@titisprojects

You just need to check the ‘Collapse When Hidden’ box on the element in the new responsive editor (assuming the page a parent containers are set up to be responsive).

image
image352×805 17.4 KB

1 Like