Issues with "font-size: 100%"
I'm new to css so I'm sorry if this is a dumb question.
I was making a site and used this:
body {
font-size: 80%;
}
Later, actually today, I tried to apply EricMeyer's CSS reset to my page above the 80% declaration, but it's causing all sorts of trouble with my font sizing.
I didn't think it would be an issue because I thought font-size 100% wouldn't change the font, it would just be "use the font of your parent" but that's not the case.
What does this font-size 100% declaration actually do? Why is it applied to every element in the reset (i.e. html,body,div,span,a,b,i,font,etc {font-size} rather than just the body{font-size} I was using, which seemed to be inherited fine)?
Before I "just remove the 100%" I'd like to know what it's actually doing. What does 100% actually mean, and why does 开发者_如何转开发Mr. Meyer apply it to a bunch of elements rather than just the body like I was doing?
Does using font-size: 0.8em;
work? Since 1em is "the size of a character", 0.8em should give you what you want.
The problem for you is that Meyer, is setting more and just the body element to 100%.
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
A quick fix would be to change Meyers font-size: 100%;
to font-size: 80%;
The font-size: 100%; is just used for resetting the style to be similar in all browsers, I believe IE6 is having some problems with this.
精彩评论