This morning we looked at an embroidery website to troubleshoot it. If everything at that page looks alright to you, scroll down a little bit.

The web page is built with nested h3 tags. Each section is inside the previous one, and so any styling in that section (such as font size) persists. The default font size for h3 is 1.17em. Using an em makes the font size scalable and defines the font size in relation to the default font size. With an em of 1.17em, the font size will be 117% of the font with no font size defined. Since each h3 is nested in the previous one, and each h3 has a font size of 1.17 em, the font size will grow exponentially, becoming larger with each nested h3. So the first h3 will be 117% larger than the default font. The next h3 will be 17% larger, the one after would be 34%, etc. If the h3 tags were not nested, or if the h3 font size was overwritten with a font size that was a fixed size, the font would not continuously scale as it currently does.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>