Using IE8, it's completely chuggered. At zoom=100%, the text doesn't line up with the background, and as you zoom out it gets worse. You have to zoom in to 125% to get everything to line up right. (Note, this is on my computer with my settings. It's very likely to vary from one computer to another).

Your main problem is that your foreground and background are totally divorced from each other. There's nothing other than lick, spit, a wing and a prayer holding them together. Using a layout table won't be helping matters, and using nested layout tables went out of fashion sometime before the Reformation, but essentially, if you want to line background images up with text, you have to make each background image a background image to the text it is a background to. You can't just line them up in your browser and assume they'll line up for everyone else.

(OK, with absolute positioning, you might "get away" with that, but you're likely to store up a whole load of other problems going down that route).

OK, with absolute positioning, you might "get away" with that, but you're likely to store up a whole load of other problems going down that route

To use absolute positioning and keep everything lined up correctly the absolute positioned elements need to be inside relative positioned elements - that way they maintain their position relative to those relative elements. Having it offset by zero from the relative element would be the only offset that would definitely continue to align correctly after the zoom is changed though.

For example the following will always place the 'z' on top of the 'a' regardless of how the page is laid out and whatever zoom you use.