I am having problems with some illustrator files (I'm a developer more than a graphic designer). Basically, I can't seem to get around two things. Firstly, I have an illustrator file in which some of the components are located at non-integer values... Is there a way to force illustrator to lock to 1 point, without having any decimals after? I need to do this because I am exporting the file into a png, and I need to be able to totally match pixels in another program.

EDIT: It seems the problem causing sections are all the text labels. Is there no way to constrain text areas to a pixel grid?

EDIT2: I just put up an example AI file here that shows my problem. If you select the text area, its coordinates are x = 49 px, y = 45.834 px, width = 48.503 px, and height = 11.11 px (from the middle), this also refuses to snap to pixels. Now, I have a whole pile of these types of components, and I don't want to go through one at a time and change them. Any ideas?

My second problem kinda arose along with my first. For some reason, when I export a .ai file to photoshop, it seems to come with a 1px transparent border around it, which I need to remove. However, I can't seem to grab it with the magic wand or anything and I don't exactly want to resize the image (cause it would throw off the other coords). Is there an easy way to do this? Thanks beforehand!

3 Answers 3


Here's how I would approach the problem.

  • If (sadly typical, which is why I mention it) your AI document is all on one layer, your first step is to move all the text onto at least one, possibly more than one individual layers. Name them appropriately so it's easy to keep track of them.

  • Next, bring the AI document into Photoshop as a Smart Object (use `File > Place') and get the background exactly placed. Don't fret the text at this point.

  • Make a copy of this layer as a new Smart Object using Layer > Smart Objects > New Smart Object via Copy. This is important. You want two independent Smart Objects, not a straight copy that would cause them to update in synch.

  • Open the one you first placed (double-click on the layer icon), turn off the text layer(s), save and close.

  • Now open the second copy similarly, and turn off the background.

At this point, your text is only showing in the second layer, and you should be able to fine tune the position from there.

Conditional: If nudging all of the text at once doesn't get you the result you need, you may have to put individual text segments on their own layers, make multiple Smart Objects, and adjust the individual text blocks independently.

The alternative approach, which would give you ultimate control, is to create the background SO as before, but then copy the text piece by piece from the AI file into new text layers in Photoshop. To make this work, you have to create a text frame in Photoshop, flip over to Illustrator, select the text, copy, then paste it into the Photoshop text frame.

This has the advantage that you now have live text in Photoshop, which you can even onion-skin over the original text if need be (by turning on the text layer in the AI file temporarily, reducing the opacity of the live text in the PSD and fine-tuning that way). This method will also keep any kerning, glyph substitution or other OpenType features intact when the text comes into Photoshop. That may be necessary if the layout needs to be very precise, but I would try the first method first.


Current versions of Ill have "snap to pixel" mode: http://help.adobe.com/en_US/Illustrator/14.0/WS714a382cdf7d304e7e07d0100196cbc5f-636da.html.

Edit: Here's an example how image looks like in Ill when pixel preview is accordingly on and off:

pixel preview onpixel preview off

In first case when also "Snap to pixels" is on, nodes will be snapped to pixel grid.

  • Hm, that seems like a step in the right direction, but I have a file already from a client, and for some reason I cant get all the existing components to snap to pixels (size and coords) :(
    – SuperTron
    Dec 10, 2011 at 2:37
  • I'm not sure if I understand you correctly, but I think you need something like hinting in font rendering technology. Am I right? If so, then I'm afraid I don't know ready solution for automatically snapping design elements to pixel grid. I think however that something can be relatively easily done in that matter: a script. Simplest idea would be to just traverse all points in design and snap them to nearest node of pixel grid. That of course would change the design itself, but I think the changes would be irrelevant.
    – thebodzio
    Dec 10, 2011 at 2:49
  • Well, I was given an illustrator file thats a background of an application, so when I put things on top they need to line up. The text sections however don't seem to want to be integer pixel values :(
    – SuperTron
    Dec 10, 2011 at 2:52
  • Could you give a little visual example? I'm not sure what do you mean about text sections. Do you want to set text size in pixels? If so, you could change units for text in "Preferences->…Units…".
    – thebodzio
    Dec 10, 2011 at 3:02
  • I assume you do have "Snap to pixel" option turned on, but do you also turned on "Pixel preview" mode? If not then no "snapping" will be done. Check my edit.
    – thebodzio
    Dec 10, 2011 at 11:32

not sure if you're still having problems with this, but the newer versions of Illustrator have options for creating web-based images. Solves a lot of issues you've listed. Check out: http://tv.adobe.com/watch/max-2013/using-illustrator-for-web-design-and-graphics/

  • Hi there! Welcome to GD.SE and thank you for your answer :) We tend not to use video-only ones because videos can change / go down and we try to concentrate the information here in one site. If you have watched it and it's possible, do you think you can add a short explanation of how this is done in the newer versions? Thanks!
    – Yisela
    Feb 25, 2014 at 19:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.