Streaming live at 10am (PST)

Pseudo classes (Hover, Focused etc) not inheriting parent class styling


Whenever I use the input fields on my webflow form the line beneath is blue. I have checked the Hover/Focus/etc on this element and nothing is blue. I have searched the parent elements and their classes and still nothing is showing me that it should be blue.

When I inspected the dom with browser dev tools, It seemed to me that it might be inherited from a parent class but I cant quite tell if this is editable if that is the case.

Thanks for your help!

Here is my public share link:

Can you provide the link per this thread so we can take a look behind the scenes? How to Enable a Webflow Share Link

thank you

Try overwriting the inherited colour value by setting the bottom border colour to the colour you want on the focused state

@Mario_Tarabbia here is a quick screenshot:

I am not sure why it wasn’t inheriting the purple value you had set. Perhaps that is the Webflow default or this is a bug?

Sure enough, this is a bug.

The blue is inherited from a root class. Even if the UI in Webflow shows that a different color is selected, the blue is still used. You must change the Input Field, Focused, Line color to something new, then change it back to the inherited color for it to work as expected.

Thanks KProServices.

No problem, at least you have a solution for now. I would change this post from ‘design help’ to ‘bug’ unless someone from @Webflow can take a look at this and possibly provide an explanatio?.

Hi @Mario_Tarabbia, I may not completely understand the sequence of events as described or what styles were applied first, but it seems the focused state now has the correct styling.

I am continuing to look at this, as I can understand how it may cause some confusion, as I have more info, I will update.

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