problem with layers in FireFox

issue with layers in FireFox

[yabewatch]

I've designed a website which looks great in IE, but in FireFox my "labels" (each label is a layer with tables in it, displaying an image and text) get messed up as their X coordinate increases. The labels on the far left side of the page look fine, but at some point in the middle of the page you can visualize drawing a vertical line, whereby the white backgrounds of the labels don't extend beyond that point. Plus, the far right layers don't show their white backgrounds at all. Then, if you take the right edge of the FireFox browser window and drag it to the left, then right, and repeat, the layer backgrounds slide accordingly.

The site is PHP and uses layers extensively.

I've played with it some, saving the resultant HTML file in the browser after being processed by PHP on the server, then changing some of the labels' X coordinates and indeed it seems that somewhere in the middle of the page FireFox doesn't want to honor the layer properties for some reason. But it's more than that...it's like there is a buffer area between where it "breaks" and the right side of the browser's edge.

All the labels are layers (divs) with the following settings (the pixel values of course differ between them):
style="position: absolute; left: 698px; top: 482px; height: 40px; z-index:2; border: 1px solid #000000; background-color: #FFFFFF; filter:alpha(Opacity=85)"

Yes, I know the alpha filter is IE-specific. I believe there is a corresponding FireFox filter named -moz-opacity, but I haven't worked that out yet.

Does anyone have any ideas on what's going on? I appreciate any help.

[JAB Creations]

Another victom of false (MS) standards...

You should ALWAYS test your site with a W3C compliant browser FIRST (GEcko or Opera) and THEN test with legacy browsers (Netscape 4, any IE).

Choose your favorite Gecko browser and test your work out and then once you have it working fine adapt IE with it's countless bugs. The people at MS KNOW the (lack of) quality of their products so at least they gave us IE-conditional comments.

As far as layers go it's all about z-index. The higher the number the closer the object is to you (the viewer) and the lower the number (negative values not allowed) the further away the object is.

[yabewatch]

Thanks much. I have set z-index, but my problem isn't with the z-index of the layers, it's with the fact that as the X coordinate increases (layer is horizontally further away from the left side), for whatever reason it's background starts to get ripped away. It's quite interesting actually. I'd be happy to share the URL with you, if you are willing to see it in action. Thanks.

[edited by: encyclo at 5:20 pm (utc) on Aug. 23, 2005]
[edit reason] No email addresses please [/edit]

[JAB Creations]

Ok I've sent you an email. My advice btw if you want to avoid spam to NEVER post your private email address clientside (on the web where serach engines can crawl). Though you wouldn't have to worry so much here as other places I suspect because this site is run smoother then the smoothest smoothy you could imagine.