Paul Randall » browsers https://paulrandall.com Experimenting for a living. Sat, 15 Mar 2025 15:32:49 +0000 en-US hourly 1 https://wordpress.org/?v=4.1.41 Background Alignment Bug Fix https://paulrandall.com/2009/08/14/background-alignment-bug-fix/ https://paulrandall.com/2009/08/14/background-alignment-bug-fix/#comments Fri, 14 Aug 2009 20:08:06 +0000 http://prandall.com/?p=143 I have recently been working on sites which have had the need for pixel perfect alignment, and I came across an alignment anomaly among the major browsers.

Previously, I have used IE7/ IE6 specific style sheets with completely new backgrounds, each 1px to the left or right of the original to compensate, but I decided to do some digging and found this blog post:

http://www.sohtanaka.com/web-design/1px-background-alignment-bug/

One of the comments I came across suggested a very simple alternative to multiple stylesheets and images, and is the version I used in my recent design:

html{background: #242424 url('../img/background.gif') repeat-y center; margin-left: -.1px; /*1px shifting hack*/}

A simple use of a margin allows the same image to be used for all browsers. What’s even better is that, although technically a hack, it is valid.

]]> https://paulrandall.com/2009/08/14/background-alignment-bug-fix/feed/ 1