On Thu, 24 Jul 2014, John wrote:
On Jul 24, 2014, at 8:40 AM, Chris Rockwell <ch...@chrisrockwell.com> wrote:
I don't think you're recognizing that em's inherit from their parent.
- #header-logo is a child of <h1>
- <h1> has a font-size of 2em (set by user agent stylesheet)
- #header-logo therefore has a base font-size of 2em, or 32px (assuming 16px is
the base)
- Padding #header-logo by 1.25em is equal to (32 * 1.25)px.
Make sense?
If you want to pad it 20px (1.25em of document base font size), you would need
to set padding-left to 0.625em
Hopefully I haven't muddied the waters.
No, actually you have un-muddied the waters. So I “did this to myself” in a
sense, by wrapping that logo in an h1..
So, I either have to keep track of the math, or…is there another, better way I
should have built that lock-up?
I guess I was going for better SEO by wrapping my logo in an h1 which, now that
I re-examine, seems like pretty weak sauce…
Perhaps I’d best wrap the logo in a regular div with an id of ‘header-logo’ ?
Note that you can also specify font-size in rem, which is relative
to the BODY's font-size. See <http://t.cfaj.ca/emsize.html>.
--
Chris F.A. Johnson, <http://cfajohnson.com>
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
