Tab Component Issues

Design help General
1

I’m experiencing an issue with my tab component where the content isn’t displaying correctly after publishing. I’ve set up different content for each tab, but only the spring term info shows up, and the other tabs don’t change as expected. I’ve tried publishing each tab individually, but it hasn’t resolved the problem. If anyone has advice or thinks this might be a bug, please let me know. I’ll share a link for reference.

Loom Link - Tab Component Issue and Troubleshooting Tips 🛠️ | Loom

Here is my site Read-Only: LINK
(Webflow - London Swim School 2025)

2

Tabs usually break when all Tab Panes end up referencing the same content or a pane is accidentally set to display:none. Had this pop up in a client build, recreating the Tabs component fixed it. Double, check each pane has its own elements inside the Tabs Content wrapper.

3

Hey @jasonjkd ,

In the tab-panel 1 element, you can open the 2nd Table embed element:

AJ - Table embed
AJ - Table embed1846×864 172 KB

You can remove the extra <style> in the top:

AJ - Table embed 1
AJ - Table embed 11821×921 141 KB

And also remove the extra </div> at the bottom:

AJ - Table embed 2
AJ - Table embed 21855×902 144 KB

Repeat the same steps for tab-panel 2, tab-panel 3 and tab-panel 4 element’s 2nd Table Embed, since it seems to be having the same extra tags.

Save it and publish the site. Hopefully this should solve the issue.

Let me know if still the tab content does not show up after making the above changes.

4

@AJ_Dev That’s amazing! Thank you so much for your help. That fixed it.

1 Like