Become Wordpress Professional - Your Ultimate Wordpress Guide

Friday, 29 March 2013

Understanding CSS Units of Measures

CSS values may be expressed in a number of different units and measures and some of the measures are only applicable in some types of values but you need to know all unit types and measures.

#column1 {
width: 100%;

The percent sign ( % ) is for relative percent in case of width of the element is 100% of its containing element.

p {
front-size: 12pt;

pt is for point such as graphic measurement such as two points in an inch and 12 points is one pica and em is another type of graphic measurement is equal to current font size in 12 points font. Like if your font is set to 32 points then one em is your 32 points. em originally meant by lower case letter m and in CSS it is needed to define the size of the font.

p {
margin-left: 4ex;

In CSS the size of an ex is defined to half of the size em and in typography the x is originally a height of the lower case letter x.

p {
padding-right: .25in;

In CSS inch ( in ) is the imperial h size and it tends to be a relative size that have to do in width of graphic environment setup and computer monitors are not tend to be setup especially when you are dealing with web pages where you have no idea what type of environment your web pages are going to be displayed at.
padding-right: 1cm;

Like wise cm count as centimeters and mm is for millimeters meters.

div#main {
width: 600px;
This one the px is pixels that is a very small area of a screen much like a full stop at the end of a sentence.

So pixels ( px ) are good for making for certain size to match and other graphic elements that are fixed size. CSS uses a con-size list of units to specify the sizes of objects on the screen and it is great to understand these units because it will help in debugging the system results when you are dealing with CSS.


Post a Comment

Please Avoid Spamming. Comments will be moderated before they are published.