CODEWITHSUNDEEP
cssphotoshop
Brooklyn Nicholson
Brooklyn Nicholson

Reputation: 646

Pixels in photoshop vs pixels in CSS?

I notice that when I measure out something in Photoshop to "ensure pixel perfection" it's usually half of what's measured in Photoshop to go to CSS. So if I measure at 60px, in CSS it goes to 30px.

But only roughly so.. Is there a way to make sure it matches 100% so I don't have to guesstimate? And why does this happen?

Upvotes: 2

Views: 1338

Answers (2)

markmaksi
markmaksi

Reputation: 31

In Photoshop: Ctrl + N > Web tab > Web Most Common This Artboard will set the settings to be fir for webpages. Now screenshots from the browser should match the PS pixels values.

Also make sure that your browser settings haven't changed the zoom ratio or font size.

Upvotes: 0

Keith
Keith

Reputation: 4147

When you are measuring out those pixels in Photoshop, you have to make sure you know what size your resolution is. For the web, it uses 72 dpi resolution, check in Photoshop under "image size" to see what resolution your image is. Sometimes images are at 300 dpi which if you use that and then try to save on the web will make the image larger than it should be.

Upvotes: 7

Related Questions