Looking for a contract position
in Toronto area as a Senior .NET Developer
Toronto, ON, M6P 2P2
Tel: 647.328.3809
Email: 

Font scale, pixels vs percent

I use my PC every day, and often by the end of the day my eyes are tired, so while surfing the internet, I use my browser setting to set large font. And I hate websites where I can’t change font size.

You can’t change font size because it size uses pixels. The better idea is use percents to setup font size.

Using percents you can change font size using your browser setting, just use your mouse wheel with Ctrl key pressed.

There is a good Yahoo UI library to perform font reset and than set default fonts size with percents.

You can add two small css files (reset-fonts.css and base-min.css) to your project and than declare your font size with percents, like this

<style type="text/css">
    .pixelFont
    {
        font-size:14px;
    }
    
    .percentFont
    {
        font-size:108%;
    }
</style>


<p class="pixelFont">
Hello this is text with font size 14 pixels. 
You can't resize this type of font.</p>

<p class="percentFont">
You can resize this font, 
because it's size use percent. 
Actually it's 108%</p>

Both fonts has the same size 14px with your default browser settings, but try to resize font size on the page with browser, and you will see than pixelFont are not resized in contrast to percentFont.

You can get more information about Yahoo User Interface Library at the Yahoo website.

 
Powered by AtomicCms content management system