How do i change an hover state of paragraph (child of a DIV)

How do i change the color of my paragraph (inside a DIV) when i hover my DIV.

It’s working for the title (H2) but not the paragraph even if i create a special class for it:

STATE01


STATE02

As you can see the hover modification is on the item01: i changed the background color and the font color.
The result is OK for background color, the title color but not the paragraph color.i want my paragraph in white, not grey

Any idea?

Here is the link of my test page : http://testludo02.webflow.io/

It’s always better to include your sharing link for us to test with.

But as far as I understand, your H changes color because it gets its color from the div, as an inheritance. When you select the H, the icon in front of the text color is orange and when you click it it says “inherited from the div”.

By setting specific class to your paragraph you may have set a specific color, so its text color doesn’t inherit from a parent (the div). So the only solution you have is having the same color for H and P, inherited from the div. And you’ll get the same hover color too. There is no way P and H inherit of different colors if you want the hover of the div to affect them both.

Just to be clear: elements inherit a property as long as this property is not set to them. In front of the text color field of your P, the icon must be blue, meaning it’s set for it, no longer inherited.

Yes understood this story about inhereted…
So i:

1- created a class for my paragraphe (P01)
2- changed font color for white on P01 hover state → to be like the title

But:
when i hover my Column1, the background goes well in blue, the Heading3 goes well in white but not my P01 (paragraph text) until i hover truly hover the paragraph.
That is not what i want.

I would like P01 goes white directly when i hover Column1 at any point

Am I clear?

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