Why is setting color of a html entity character failing?

Question

I have this character code <span class="psi">Ψ</span> for a psi greek character.

This is the css code for

.psi{
color:red !important;
}

the class psi.When i try the code out in my firefox web browser,the character is not red. Why is this?.

What version of Firefox do you have? I believe the latest is 35.0. On another note, does it have the same effect in other web browsers (Chrome, Safari, IE)? — eggy
– eggy, Commented Jan 22, 2015 at 12:17

Gabriele Petrioli · Accepted Answer · 2015-01-22 12:20:57Z

3

That can happen only if you have another rule (more specific) with !important that also applies to that element.

For example

#wrapper span{
    color:blue !important;
}
.psi {
    color:red !important;
    font-size:3rem;
}

<div id="wrapper">
    <span class="psi">&#936;</span>
</div>

So check for overlapping rules.
(and try to not use !important. You should be able to do what you want by using more specific css rules)

answered Jan 22, 2015 at 12:20

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sylvain YVON · Accepted Answer · 2018-04-03 07:42:51Z

0

You cannot change the color of some html entities in Firefox (at least up to 60.0b8). Some examples are ❓ and 📖:

.psi{
  color:blue !important;
}

<span class="psi">&#10067;</span>

It works in Chrome.

answered Apr 3, 2018 at 7:42

Sylvain YVON

438 bronze badges