H6 doesn't follow the active rule of Text White

Design help Layout & Design
1

I want to change the font color of the heading in quotes under “Why founders love us” when the tab link is active. It’ll make more sense when you see the active tab.

Here is my site Read-Only: site link
([how to share your site Read-Only link][2])

2

Add an HTML Embed to your page, and this custom CSS;

<style>
.tab-link.w--current h6 {
    color: inherit;
}
</style>

You can set it to a specific color if you like, but here I’ve used inherit so that it will inherit the color you set in the designer for your tab link.

4

Thanks. I thought about doing custom code, but wanted to see if it could be done through the designer. :pensive:

5

No, and I was just reflecting on this yesterday in a blog post.

In general, the Webflow designer doesn’t have any means to style things contextually, for example if you want an H2 to look different when it’s inside of div classed hero.

But also, support for style inheritance appears to have been removed. It used to be that certain styles such as color worked in 3 ways-

  • Set the color you want, in the class you’re working with
  • Leave it unset, and let the rules cascade, all the way up to “All H2’s” for example
  • Set it to inherit from its containing element.

IIRC, that third one was done by putting a hyphen into the color code field, but that stopped working some time ago. I researched it but never found any documentation on how to set inherit through the designer, and I use it often.

So… custom code it is. If you find it, let me know.

1 Like