Problem with "Current" Tab text

Using a Tab Widget, I am having difficulty changing attributes of the Tab Text for the current page. I have no difficulty changing the attributes of the Tab Link, which clearly indicates that it is the “current” page. But when I click on the Tab Text of the current page, the “current” designation disappears. Then, when I try to change the color or font size of the Tab Text on the “current” page tab, all of the other non-current Tab Text fields also change. Strangely, the first time I used a Tab Widget I had the same problem, but after a lot of trial and error I finally made it work properly. However, I cannot seem to be able to reproduce what I did, so this second effort to change the Tab Text of the current page is driving me nuts. Any suggestions?

NOTE TO WEBFLOW: Why doesn’t the Tab Text field also indicate that it is the “current” page?

The “current” for the tab links means “current open tab” so that you can style what the tab looks like when the pane is open for that tab. Does that make sense?

Thanks, Sergie. Yes, I am pretty sure I understand how tabs work. But there is a difference between the way the “current” tab link and the “current” tab text inside the “current” tab link work. I have no problem styling the “current” tab link without changing the style of the non-current tab links. However, the tab text inside the “current” tab link is a different story. The tab text does not show the “current” style indicator, and when I try to change the font characteristics of the text within the “current” tab link, the text for ALL of the tabs changes. This is not the behavior I want or expect. The tab text should also be able to take “current” characteristics that are unique to the “:current” status.

Hey @Bill616 Would you mind sharing a link to a project with this kind of issue? I think i understand your predicament, and might be able to recommend a better of setting up your tabs.

Hi, Tim,

Many thanks for your offer, but I am afraid we are unable to share a link to our project for privacy and intellectual property reasons. It is very frustrating that Webflow expects their customers to provide most of their support and then does not make it possible to share just one page of code, at least as far as I know.

Can you give me a hint as to what we might being doing wrong? We have some tabs which do show different font characteristics for both the current link and text and some that don’t. We have tried hard to figure out why this might be happening, but we can find absolutely no differences between the styles and design of the two tab examples even though the behavior is different. Any clue you might be able to provide would be gratefully appreciated.

Ciao! Bill

Hey @Bill616! So I think the only thing i can suggest then is for you to duplicate the project and in the duplicated project delete all the pages you wouldnt want us to see. Keeping only the one displaying your issue. Then share the link to this page. That way at least someone would be able to see issues you describe with Tabs. Currently i’m not sure at all.

Just a quick note…

I don’t think they expect anything. It’s a forum and I like helping where I can :slight_smile:

1 Like

@Bill616, I see the issue here and because I don’t have the read only link it’s going to be a little difficult to explain but here is how to fix it:

Remove the classes from the “tab text” (which is the text block within the tab link) on all the tabs.
Then add the styling you want the “tab text” to have on the typography section of the “tab link”

The styling will apply to the “tab text” within due to the way that styles in webflow (and CSS) “cascade” down.

Then, in order to distinguish the “current tab text” from the “tab text”, change the typography styling on the “current nav link” and that will apply only to the text within it.

Hope this helps!

In the future, if you would like to talk to a webflow staff member you can contact the support team directly via email, and they can help you out, though personally I feel like the forums allow you to tap the abilities of far more people, all of whom are only here to help :smile:

Feel free to let me know if you need any more help,

Arthur

1 Like

@Bill616 It appears @jaidenleach fixed the issue here: Problem with Tab style behavior - General - Forum | Webflow.

@thesergie @tim

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