Why does user agent stylesheet override my styles?

Joe picture Joe · Jul 5, 2012 · Viewed 57.8k times · Source

I want a font-size of a 11, but Chrome and Firefox are giving me 16. When I examine the element in Chrome I see and look at the computed property I see:

font-size: 16px;
  table - medium user agent stylesheet
  Style Attribute - 11px
  table - medium user agent stylesheet
  .v11gray - 11px style.css

Under computed styles in Firefox I get:

font-size: 16px
   TABLE[0].style → 11px    element
   .v11gray → 11px  style.css:19

The last three lines are struck out. Why is my css rule being overridden? Are there steps I can take to find out?

Answer

kburke picture kburke · Jul 18, 2012

This is an outside shot without your code, but the solution when I had the exact same problem. My DOCTYPE statement had gotten fouled up by an errant keystroke, as described in this question. You might want to inspect it visually and/or validate.