Here is a quick lesson on CSS3 units of measure:
px -Pixel is exactly as described. It allows you to define size based on number of pixels. ie: 5px
em – em’s is the width of the letter M. If font size changes, this size will change in relation to the font size. em’s are relative to the parents font size. Example: If you apply a font size to a div, em’s would change relative to the div’s font size, not the document.
rem – rem’s are same as em’s except that they are relative to font size of entire document, not the parent.
% – Percentage sizes to given percentage of the parent. Example: width=5%; sizes to 5% of the parents width.
Still Experimental (buggy):
vw – Viewport Width – Resizes based on the viewport width (example: 5vw;), resizing the width of an open window, vw will change based on the windows size.
vh – Viewport Height – Resizes based on the parents height (example: 5vh;), same as above except it will adjust based on windows height.
vmin – Viewport Minimum – Resizes to the minimum width or height of the viewport. Calculates which is smaller and bases size on that number.
vmax – Viewport Maximum – Resizes to the maximum width or height of the viewport. Calculates which is larger and bases size on that number.
Questions? Twitter: @_codemics