Alignment issues

Tags: , , , , ,

Ever have this problem where your centered elements will “wiggle” out of place when you adjust the size of your browser?  It’s just by one pixel, and annoys me to death.

I found this article about it: http://acko.net/blog/css-sub-pixel-background-misalignments

It seems like it’s a margin/padding issue.  I took the offending div element and added “margin-left: 1px;” to it’s class and it worked!  Beautifully :)  You may also need to nudge any background images by one pixel.

It does concern me that other elements on the page align perfectly, where it was only the #footer div that was giving me grief.

UPDATE

The aformentioned fix applies to 100% divs that have a centered background.  I came across this same problem in a div that was set to margin:auto;.  I went ahead and added “margin-left: 1px;” to the body and that fixed everything up nicely :)

Permalink » No comments