Skip to main content

Posts

Showing posts from November, 2012

A tip for relatively sized Html input elements using `em` units

And why I use Yahoo! (YUI3) Reset CSS NowFor better or worse when doing front end development I prefer to use percentages and em as the unit of size when styling. This approach could be a bit tricky but with proper experience and the use of css screen size conditionals does allow for one rendering base for multiple screen sizes. As base I set px font-size only on the <body> html element and then afterwards use em to style all other elements; of course using pixel based units where it makes sense. This allows for example the quick changing of the font-size just on the body tag and having all the header resize accordingly.One annoyance that I experienced was that input radio and check buttons didn't honour the font-size of the body and I always just worked around the issue by explicitly styling the input radio or checkbox buttons height to a em value that made it look good. However, today by pure accident I discovered that adding font-size: inherit to the input styling fixed …