How can I change the color of an h3 based on the state of the parent tab link?

[Al_Yu]

Check the “Challenges in Accounting for CPG Companies” section. There are two tab elements (my two attempts to solve the problem).

I need to place an h3 inside a tab link, and when the tab link is in the hover or current state, the h3 should turn blue.

Everything works fine on the Desktop breakpoint. It also works with plain text.

However, on the 1920 and up breakpoint, the h3 styling no longer works.

---

Here is my site Read-Only: LINK
Live: LINK
(how to share your site Read-Only link)

[memetican (Michael Wells)]

[Al_Yu]

You suggest just changing color of h3 itself?

Here’s the result. All of them are blue now

[memetican (Michael Wells)]

What’s happening that your global styles like All H3 Headings are competing with the styling you are trying to inherit from your currently selected tab.

Now you have All H3 Headings set to Black- which is overriding the blue that the current link is styled as.

Instead of setting it to black, reset that style [1][2][3][4] so it has no Color override. Then your inheritance will work [5].

[Al_Yu]

@memetican Oh, now I get it! It worked. Huge thanks! I thought I was going to go crazy