cancel
Showing results for 
Search instead for 
Did you mean: 

why won't firefox do the a:hover{font-size: 1.2em;} when all the others do? emphasize all

Highlighted
New User

why won't firefox do the a:hover{font-size: 1.2em;} when all the others do? emphasize all

I have in my css stylesheet, the statement a:hover{color: #FF0; text-decoration: underline; font-size: 1.2em;} All of the other browsers increase the font-size and such but I cannot get yours to do it.

3 REPLIES
SUMO Contributor

Re: why won't firefox do the a:hover{font-size: 1.2em;} when all the others do? emphasize all

If I open the web console on this page (Ctrl+Shift+k), and then paste the following very long line of code after the caret (>) and press Enter, then the links do get larger when I mouse over them. Can you replicate that?

var sty=document.createElement("style"); sty.type="text/css"; sty.appendChild(document.createTextNode("a:hover{font-size:1.2em;}")); document.body.appendChild(sty);
SUMO Contributor

Re: why won't firefox do the a:hover{font-size: 1.2em;} when all the others do? emphasize all

I found an exception. "EDIT THIS POST" has a higher-precedence rule, so my test needs to be modified to include !important:

var sty=document.createElement("style"); sty.type="text/css"; sty.appendChild(document.createTextNode("a:hover{font-size:1.2em !important;}")); document.body.appendChild(sty);

Article introducing the mysteries of CSS precedence calculations: http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/

Site Moderator

Re: why won't firefox do the a:hover{font-size: 1.2em;} when all the others do? emphasize all