converting a design to css

I have a designer that has been helping me with a website. Unfortunately, they are unavailable at this time and I need to get this project done. Unfortunately, my CSS is not making the result look like the design. I have the following HTML

<h1>CUSTOMERS WELCOME</h1>

My CSS for H1 tags is as follows:

  h1 { color:#2D2D2D; font-weight:normal; font-family:Arial; font-size:24pt; letter-spacing:75%; line-height:24px; }

The designer wrote me a note before they left saying H1 tags should use the following settings: Font - Arial, Regular, 24 pt, color - HEX: #2D2D2D, Tracking (letter spacing) 75, Leading (line spacing) 24 Text is full justified

What am I doing wrong? My H1 tags look lar开发者_StackOverflow中文版ger and bolder than those in the design.

Thank you!

you have

font-size:24pt;

change pt to px

pt stands for points (I think) and px for pixels. That should work better because a pixel is a pixel, pt or em can vary from browser to browser

For the font-size, I would use 24px instead of 24pt. Points are used more for print than screens.

Point sizes vary from browser to browser and from OS to OS. It sounds like your designer is not that familiar with web design, where we generally use pixel measurements to maintain consistency.

24 points != 24 pixels, you can't just change units and expect it to be the same. In my screenshot (FF Win7) of 24pt text, the font is actually 21 pixels high.

See this chart: http://sureshjain.wordpress.com/2007/07/06/53/