Question

Go to this page and look at any paragraph’s text font size using Firebug. The font size is 13px. Here reset.css body: font-size 100% is overrding master.css body: font-size 62.5%. Why?

My understanding is that if the same tag is defined in two css files, the one that comes last takes precedence. I expected it would use the one from master.css line 10. Don’t the the two Body tags have the same specificity?

Answer 1

p takes precedence over body as CSS stands for Cascading Style Sheets

body -> p

#master.css
body {
   font-size: 62.5%;
}

#reset.css
body, ..., p {
   font-size: 100%;
}

Remove the p element from reset.css and you’re fine! You can also give the p element a class or an id and you could also add something like:

#text.css
p.standard {
   font-size: 55%;
}

Hope it helps!