Font sizing with rem - Snook.ca

Submitted by Benjamin Melançon on November 8, 2011 - 7:37pm

Link Title and URL:

What do we do for browsers that don't support rem units? We can specify the fall-back using px, if you don't mind users of older versions of Internet Explorer still being unable to resize the text (well, there's still page zoom in IE7 and IE8). To do so, we specify the font-size using px units first and then define it again using rem units.

html { font-size: 62.5%; } body { font-size: 14px; font-size: 1.4rem; } /* =14px */ h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */

Comments

Post new comment

Your name: *

E-mail: *

The content of this field is kept private and will not be shown publicly.

Homepage:

Subject:

Comment: *

You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
You can use Markdown syntax to format and style the text. Also see Markdown Extra for tables, footnotes, and more.
Web page addresses and e-mail addresses turn into links automatically.
Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
Lines and paragraphs break automatically.

User login

Font sizing with rem - Snook.ca

Comments

Post new comment

Search

Agaric?

Agaric Design Collective

Copyright