Jump to content


Photo

ems vs pxs


  • Please log in to reply
1 reply to this topic

#1 spyke01

spyke01
  • Members
  • PipPipPip
  • Advanced Member
  • 74 posts

Posted 23 July 2006 - 08:00 AM

i am redesigning my current site with more css and JS, and wanted to see what the big difference is between ems and pxs. is there a way to make  1em=1px? the reason i ask is because i like the control i have with pxs, if i cant make them the same, or its not a good idea, then can someone help me with this:

Ok we have this box:
+----+----------+
|      |              |
|      |              |
|      |              |
+----+----------+

It is 900px wide, the left column is 200px and the right 700px, we want 2px padding all the way around, so our css is like this:
#box {
     width: 900px;
     padding: 0px;
     margin: 0px;
}

#left-col {
     width: 196px;
     padding: 2px;
}

#right-col {
     width: 696px;
     padding: 2px;
}

how does this relate in terms to ems if our default text is this:
body {
	font-family: Helvetica, Tahoma, Verdana, Arial, sans-serif;
	font-size: 12px;
}


[a href="http://www.fasttracksites.com" target="_blank"]Cheap PHP Hosting[/a]

#2 AndyB

AndyB
  • Staff Alumni
  • Advanced Member
  • 5,465 posts
  • LocationToronto

Posted 23 July 2006 - 08:15 AM

http://www.clagnut.com/blog/348/ explains in considerable detail as well as addressing your (type) of problem.  One em is the width of the letter M (hence the name).
Legend has it that reading the manual never killed anyone.
My site




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users