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.
All Replies (3)
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);
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/
Modified