Slider doesn't work correctly in Tab component

Hi all!

I am having a problem with one of my client’s project.

On preview and on the live site the slider is buggy. The first works perfectly but when you change a tab, the slider breaks as you can see.

I have no idea what the problem is, any help would be appreciated:)




Maybee you should not use the tab component but create buttons that hide show the differents sliders This way you will have more control on the elements.

As Tab is a Webflow element on witch you don’t have full control, in this kind of situation I prefert to use element on witch I have full anderstanding of the behavior.

1 Like

Yes, that was my first tought but that’s harder to edit for a non-technical person who does not really understand how webflow works. The goal is an easy to manage website where the client can just go and text or another tab or slide.


If you set the hide/show states of the slider in the anim, the client will see the sliders in the Designer. All of them will stack, so he can edit, and maybee he will be able to edit in the editor ( test it) after that, on first click the buttons hide all the base class (ed “sliders”) of the sliders and show only the targeted combo class of the slider (eg “slider-one”).

And you remain in control

1 Like

I see that you were able to resolve the issue, I am having the same issue. Can you share you solution?

I am facing the same issue. Does somebody know a solution without building a custom tab component?

I have found a solution.
I don’t know why, but the slider doesn’t work when it is in a grid or when the parent element uses flexbox.
My layout in the tab panel has two columns. I built them with floats instead of display grid or flexbox and now it works.

wow, thank you, Mirko.
it works — nesting sliders inside columns inside tabs.
honestly — shame to webflow for such a bug, but mostly for not bringing the solution and taking part in this discussion

1 Like