How to modify only via CSS a color already defined in HTML?

Question

I'm trying to modify a color in a text marked by the tag "U" with the color already defined in html.

It is so in html:

<u> <font color="#0000c0">somente no seu e-commerce</font> </u>

I tried as follows in the css:

u {color: rgb (20,20,20)! important; }

but I do not accept the color, I believe that the fact is defined in the source code.

the important detail, I do not have access to modify the html, as it is generated by web software. all layout modification gotta be done ONLY by CSS.

Hi there, SO is English only, so please ask in English, or use [one of the language-specific SO variants](http://stackexchange.com/sites#technology-name), probably you need this one: http://pt.stackoverflow.com/. — Patrick Hofman, Oct 26 '16 at 12:44
@PatrickHofman — No, it's a completely different issue. There's no inline style in this question. — Quentin, Oct 26 '16 at 13:38
@Quentin This does work though, as proposed in the dup: `font[color="red"] { color: blue; }` — Patrick Hofman, Oct 26 '16 at 13:43
The color of the font is controlled by the innermost tag `font` in your code. Your CSS sets the font color on the outer element `u` only. Use `u font {color: rgb (20,20,20)! important; }` instead. And just for completeness' sake, `font` tag has been deprecated since WW II. — connexo, Oct 26 '16 at 13:43
But still it is a duplicate. I just say the duplicate answer fixes the problem @Quentin — Patrick Hofman, Oct 26 '16 at 13:45
@PatrickHofman — It doesn't. Some code that was vaguely inspired by that answer fixes the problem, but that code is unnecessarily bloated, and the explanation on the answer is completely wrong for *this* question. — Quentin, Oct 26 '16 at 13:46
@Quentin I did not get the chance to choose answer or comment, since this question is on hold. — connexo, Oct 26 '16 at 13:47
@connexo — So vote for it to be reopened and give an answer when it is. If a question is closed it shouldn't be answered, comments are not a way to bypass that rule. — Quentin, Oct 26 '16 at 13:48

connexo · Answer 1 · 2016-10-26T14:18:10.457

The color of the font is controlled by the innermost tag font in your code. Your CSS sets the font color on the outer element u only. Use

u font { color: rgb(20,20,20) }

instead. Also notice that there cannot be any space between rgb and 20,20,20), also there may not be any space between ! and important.

On top of that, !important is appparently not necessary here as CSS styles for color seem to beat the specificity of inline color attributes.

And just for completeness' sake, the font tag has been deprecated since WW II (or somewhere around that time ;) ).

u font {
  color: rgb(20, 20, 20);
}

<u><font color="#0000c0">somente no seu e-commerce</font> </u>

It works as follows: u> font {color: corDesejada! important; } It worked. thank you — Harry Carvalho, Oct 26 '16 at 14:04

Quentin · Accepted Answer · 2016-10-26T14:41:54.797

0

Your code is successfully changing the colour of the <u> element, but you can't see any effect because the <font> element does not have color: inherit (and there is no text outside of the <font>). It has its own colour and does not use the <u>'s colour at all.

To change that, you need to target the font element.

font {
  color: rgb(20, 20, 20);
}

<u> <font color="#0000c0">somente no seu e-commerce</font> </u>

There is no need for the rule to be !important. There's no CSS of a higher specificity to hammer.

edited Oct 26 '16 at 14:41

answered Oct 26 '16 at 13:56

Quentin

914,110
126
1,211
1,335

Thank you for your help. It works as follows: u> font {color: rgb(20,20,20) ! important; } It worked. thank you – Harry Carvalho Oct 26 '16 at 14:03
dont work without `!important`. i tried. was needed insert `>` between elements. – Harry Carvalho Oct 26 '16 at 14:39
@HarryCarvalho — I've edited a live demo into the question. It doesn't need `!important` or `>`. If your code does, then you have other code influencing it which you didn't include in your [mcve]. – Quentin Oct 26 '16 at 14:42
As I said above, my code was created by a software ( a web survey software, in ASP), an old software. That generate a dirty code, full of tables, scripts and inline styles, maybe some is ovewriting. One more time, thank you. – Harry Carvalho Oct 26 '16 at 15:08

How to modify only via CSS a color already defined in HTML?

2 Answers2