Buggy tabs styling - no way to add class for the active tab

Where? Chrome incognito

What? (Very buggy - it’s better to look at the video)

If I added class to active tab no selector added (tab1 on the video above)
image

@Brando could look at this? Thanks

No video viewable in this post

Please reattach and describe.

HI @Siton_Systems,

Can you please post the site Read-Only link, so that we can take a look on our end?

Also the video you posted earlier is not loading, can you please upload it again?

Thanks in advance!

2 Likes

No, the video you posted did not show!

Also please provide your Share Link for us to review.

1 Like

sorry. The video again. In summary - when you add class for the active state the class added not in the UI (No way to rename the class for example -or- remove)

tab1 in my example work very weird

I get your issue. Use the settings tab in the top left, or just hit the letter “D” on your keyboard. From there you can select the active tab. When you are on the active tab then you can create the class you want.

Hi @Siton_Systems

Start by giving each tab the same class, then you’ll be able to style the active state.

@donaldsv - @QA_Brandon - i will try thanks. Anyway its looks weird flow.

Example: in the navbar the UI is with current inticator:
image

1 Like

Yeah that’s because you already have a class set. The “current” state is acting as a combo class.

I follow your steps - not working - maybe this issue is true only for me (I use incognito so its little weird (windows)).

Thanks

Can you share a read-only link?

1 Like

In my case no way to override the combo (.w-tab.link.w-current)

I’m sorry but we can’t help you without a read-only link.

Thanks. I will write to the support. Looks like this is a bug only in a specific project.

1 Like

Maybe you can try to create a new project with only the tabs component to see if it works?

I will try.

@QA_Brandon, @donaldsv, @nita thanks.

2 Likes

@donaldsv @Nita @QA_Brandon I am having the same problem now. I know how to and have created tab views in the past successfully. But now, I lost the functionality to update the current tab’s class. All other tab settings are able to be manipulated with no problem. I select the current tab and ensure that it is selected, but when I try and edit the current tab, the class disappears. There is no current state. The only option is to edit “All Links” but that’s not what I need to do.

What am I missing?

Here’s a mock site (it’s not working on my client’s site either so it’s definitely buggy site-wide)

https://preview.webflow.com/preview/pifedconsulting?utm_source=pifedconsulting&preview=24745d66876cad9f07c283ec5ce036e8

Any help is much appreciated!

1 Like

@n3tworth here is a screen share of a project that I built that has the Tabs panel in it.

LMK if you have any other questions.

I will test it on another page. What would you like to do with the “current” tab settings?

Your tuturial is great. Anyway for me (In one project) and for @n3tworth - it not working (See my video screen share above).

I think its related to old projects (In my sites only in one old project this bug happens).

Read only-link

under “tabs bug” page:
image

https://preview.webflow.com/preview/1128388c1b05c2347c44e5a36-20a1b7ec802a5?utm_source=1128388c1b05c2347c44e5a36-20a1b7ec802a5&preview=28e4822d9ffeb8cb636899f240fb98cf

https://streamable.com/mliei

Just fti, I have no video to watch. Try using Loom for your video captures.