Match comps to html pixel perfect

Is there a program that will show you guides, rulers so you can开发者_运维知识库 match your html layout in css to your Photoshop comp. What is best practices. Right now I'm doing screen shots and using rectangle tool to get my measurements from the screen shot and see if they match the comp but this is taking so much time. I'm thinking there must be a program or something that can show rulers or measurements or even comp overlays with measurements to fine tune your css pixel measurements to.

Try the Pixel Perfect extension: https://addons.mozilla.org/en-US/firefox/addon/pixel-perfect/

Pixel Perfect is a Firefox/Firebug extension that allows web developers and designers to easily overlay a web composition over top of the developed HTML.

I find the FireFox MeasureIt tool handy for things like this:

https://addons.mozilla.org/en-US/firefox/addon/measureit/

https://addons.mozilla.org/en-US/firefox/addon/pixel-perfect/ as it was said before. And btw, you can measure distances in photoshop as well: sometimes you just need a value, not messing around with pixel perfect. Use rulers and the Ruler Tool (Shift+I until you get it) in PS. I combine measurements in PS and PixelPerfect addon in my work.