X
Tap here to go to the mobile version of the site.
Your Firefox is out of date and may contain a security risk! Upgrade Firefox

Support Forum

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

Posted

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.

Additional System Details

Installed Plug-ins

  • Shockwave Flash 11.6 r602
  • iTunes Detector Plug-in
  • Adobe PDF Plug-In For Firefox and Netscape 10.1.6
  • A plugin to detect whether the Adobe Extension Manager is installed on this machine.
  • MindSpark Toolbar Platform Plugin Stub for 32-bit Windows
  • MyFunCards Installer Plugin Stub for 32-bit Windows
  • The QuickTime Plugin allows you to view a wide variety of multimedia content in Web pages. For more information, visit the QuickTime Web site.
  • A plugin to detect whether the Adobe Application Manager is installed on this machine.
  • Google Update
  • Adobe Shockwave for Director Netscape plug-in, version 11.6.5.635
  • 5.1.10411.0
  • Intel web components updater - Installs and updates the Intel web components
  • Intel web components for Intel® Identity Protection Technology
  • npapicomadapter
  • NPWLPG
  • The plug-in allows you to open and edit files using Microsoft Office applications
  • Office Authorization plug-in for NPAPI browsers

Application

  • User Agent: Mozilla/5.0 (Windows NT 6.2; WOW64; rv:19.0) Gecko/20100101 Firefox/19.0

More Information

jscher2000
  • Top 10 Contributor
2352 solutions 20830 answers

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);
jscher2000
  • Top 10 Contributor
2352 solutions 20830 answers

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 by jscher2000

cor-el
  • Top 10 Contributor
  • Moderator
10742 solutions 96657 answers

Helpful Reply

See also https://developer.mozilla.org/en-US/docs/CSS/Specificity