Streaming live at 10am (PST)

Expanding Div not pushing Elements Down


#1

I am trying to have expanding divs with extra content that appears on click of a button. I’ve sorted the expanding and closing of the content, but for some reason it won’t move other divs down when content is expanded (It does in preview mode but not in actual published state (as you can see here: https://peeracademy.com/old-pages/symposium-sessions-test)

I’ve tried everything and can’t seem to fix it!

Note I think I need all the Divs in the same overall Div Container for the filtering to work.

Can anyone help!!
@sabanna

Thank you!!!

Here is my public share link: https://preview.webflow.com/preview/peeracademy-main?preview=94144d2e1866583a3d2de449b45e3a07
(how to access public share link)
The Page is Symposium Sessions TEST


#2

Hello, @Toby_Parmenter!

In your case expanding will not work because you are using Isotope plugin. That plugin set all filtering items to position: absolute and automatically calculates their positioning on the page, depends on the initial size of each item.

As you probably know, by CSS rules absolute positioned item will not affect positions of its siblings/neighbors. It means that no matter how much your item will expand it will not push divs around.

You might want to re-think the way of showing extra information on each item or you may use MixitUp plugin for filtering (http://mixitup-filtering.webflow.io/mixitup-plugin-dynamic-content) which using position: relative setting for its filtering items.

Hope it helps.

Best regards,
Anna


#4

Hi Anna,

Thanks, I’ve tried to follow your awesome tutorial for MixitUp - struggling a little bit with implementing it, feel like I’m falling at the last hurdle! Any help would be greatly appreciated.
peeracademy.com/old-pages/sessions-copy

Thanks so much
Toby


#5

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.