The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › CSS › [Solved] :active doesn't work when element has inline-css
I’m developing a WP site and I have a problem with CSS. I’m generating inline style for the element, because elements are dynamically created. That element also has css from style.css file for :active. See the code
Now, #site_index .square-box:active gets crossed in Chrome inspector. Why? It is the same element, but the other one is on :active. Can I do something to get this effect on :active?
1) Your CSS calls for #site_index .square-box:active, there is no #site_index.
2) Even removing that, yes inline styles will overwrite :active, :hover, etc.
But, you can check this out: https://css-tricks.com/override-inline-styles-with-css/
Maybe that’ll help.
Because I didn’t include it. It’s far away.
Anyway thanks. !important helped. Stupid CSS logic. :active,:hover should be stronger than default state.