I'm using Adobe Illustrator to produce the UI designs for a complex web app and I need pixel accuracy. However, Illustrator seems to be a bit of a pain when it comes to pixel accuracy as its not doing what I want it to do right now, and so I'm looking for some assistance.
To break it down into an example, I have simple rectangular shaped button on my dartboard consisting of a rectangle shape with a fill and 1px stroke, then some text and an icon on top. However, the stroke lines are sometimes appearing too thick perhaps the left or right hand edge; when zoomed in, there seems to be another pixel worth added to one side with a lighter shade of the stroke colour. Please note that the stroke is on the inside and not centered.
Switching on Align To Pixel Grid seems to resolve this SOMETIMES, but its erratic. But what annoys me the most is that when this is switched on, the appearance looks correct, but the shape's transform guides are out of line with the actual pixels, and so when I move the object it around, it's always a pixel off. This is really frustrating when I'm trying to align all my objects and turning my UI into a mess!
Is there any advice anyone can offer to resolve this and make my workflow a little less stressful?
Thanks!