Streaming live at 10am (PST)

I can no longer use non-tab elements in my tabs menu

I’m having an issue which I think is related to an update to the Webflow designer. On my business website, I’m using tabs to fade in/out the different sections. I’ve used diamonds (text blocks) to separate the tabs for design & readability. When I was building my website, I just typed the diamond symbol into the text block, and dragged the text block in between the tabs. The site works perfectly like this.

A few months later, I went back into the designer to push a couple updates to my site. However, as soon as I clicked on the tabs section, all my diamonds jumped out of the tabs area into a different section of my site. When I tried to drag them back down, I got this message:

Only Tabs links can be moved inside a Tabs menu.

I emailed support about this, and I heard back that the error message is correct: you can’t use non-tab elements inside the tabs menu. However, I was able to do this without any problems before. So now I’m in a spot where I either have to not (never?) update my site, or update it and lose my current design. I’ve asked the Webflow team if it’s possible to restore the ability to use non-tab elements in the tabs menu, so I’ll see if I hear back.

Until then: could anyone suggest a workaround? I’m basically looking to have non-clickable diamond characters between my tabs, so that they’re clearly separated visually.

Thank you for any and all suggestions!

1 Like

Probably not the solution you desire, but some imitation

First, set Tab style to be Inline Block

It won’t affect anything.

Then place your Dimond in Tab block using Text block:

Set up the styles for Dimond

position: absolute;
right: -22 px;

Don’t forget to increase Tab margins first

The last one:

Of course our diamond is clickable as it placed inside Tab block. Let just say the diamond not to show that he is clickable guy :slight_smile:

Fits? :slight_smile:

That’s actually a pretty acceptable workaround - I’ve updated my site with the changes you described. Of course if someone clicks on a diamond it’ll change the tab, but the cursor won’t change on hover so hopefully that won’t happen. It’ll do for now, thank you for your help!

I just stumbled upon the same thing and I see it as a limitation. I am curious to know why they have removed this possibility, maybe it messes with code?

Not sure but that’s what I’d assume - I hope they’re able to restore this functionality sometime!


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