Dynamic item changes CSS settings with Isotope filter

Design help Custom code
1

Hi everyone!

I’m designing a dynamic audio page and added isotope for filtering. As soon as I add Isotope code, the collection item element changes it’s css, without isotope it pushes all items below down when I open the audio card, but with Isotope scripts, that style is overriden and the card opens on top of the next one, I tried playing with collection item (.aud-item) by making it static , but it doesn’t seem to work and I can’t understand isotope’s manual.

Any ideas? Page called Audios in the project. You will see it working as it should on the preview link, and here is what happens to a published project with Isotope scripts: https://zbsnew.webflow.io/audios

Here is my site Read-Only: LINK

2

I have a bit of a progress, by adding this to the Isotope script, now it loads the dynamic items correctly, looks lite it was overriding Webflow styles, but now I have another issue: on the initial load everything is perfect, but after I apply filtering my footer jumps on top of the dynamic items. Looks like the footer loads before the Isotope is changing the grid height.

Any ideas pretty please :ok_man: :white_flag:

$(function(){
$('.w-dyn-item').css('position', 'static');
});
$(function(){
$('.grid').css('height', 'auto');
});