One problem you have on that page is that the layers have been placed into
table cells. This is a mistake - see the layer laws here -
http://www.great-web-sights.com/g_layerlaws.asp
Absolutely positioned elements should NEVER be placed inside table cells.
They should be placed inside either only the body tags, or another
positioned element (this latter use is an advanced use that I won't go into
now).
This means you should find each of the layers in your code view, cut its
code from the page, and paste it back in either directly below <body> or
directly above </body>. Now your page will at least render the same on Macs
and PCs. (you may need to manually jigger the layers back into position
after doing this)
In adiition, you should do two more things -
1. Remove the height specification from your layers and let the contents
set the height.
2. Use CSS to control that background so that it doesn't repeat, e.g., div
{ background-repeat:no-repeat; }.
Finally, I'd change the id of the layers to something without underscores.
It has been my experience that underscores in ID values (even though they
are legal) can cause cross-browser/platform problems). This will require
that you adjust your show/hide calls to the corrected layer name....
If you really want to be thorough, adjust the z-index of all the layers to
be the same value - they do not need to be spaced like you have them.
Now - you are saying that sometimes the background image in those layers
doesn't show up in IE6? I cannot duplicate that on my systems.
Long-winded response for nothing, huh?
