layer problem in mozilla

hi
i have a strange problem with my layers. I have nested layers and i managed them to always show correctly. (layers are on top of each other, i hide/show them)
This works under IE, opera, netscape 7 but not in mozilla 5. (altough they use same core: NS about says Mozilla/5.0)

In mozilla the child layers will be placed much too low.

Who can help me out with this? the page can be found on http://pro24.msshost.com/~pucazone/...porno/index.htm


I'd also like to center the box vertically. I did this with putting it in another table, but child layers stayed fixed on resize (in all browsers).
this however is not necessary, but would be nice..

thanx in advance

AFAIK, Mozilla is at ver1.6
Netscape went to ver 5 from memory, but not many people downloaded it. Do you really need NS5 support? I would focus on getting it to work in IE5.5/6.0 and Mozilla1.6 (or Mozilla FireBird)

I thought Netscape skipped from 4 to 6?

I too would focus on the mentioned browsers... Netscape users are slowly being weened onto version 7, and few are moving over the Mozilla/FireBird; although I recommend the latter to everybody!

its not a matter of your code, its a matter of how ie and mozzilla see layers, the safest way to do it is in tables, they both read it very similar, its really hard to get both pages matching in ie and in mozilla

Can you elaborate Bruski . Tables and layers are completely different things.

i find that using tables is much simpler while layers are very useful, they are much more difficult to make adaptable to every browser. In my opnion, having worked with both, tables are easier to work with and almost always produce the same results on different browsers. I use mozilla and i design or build a site, i usually look at mozilla and ie in order to get the best picture of what it looks like on a not so common browser and the most popular one. Its a matter of preference, and its really a hassle to do layers, and do them correctly hope that helps

That's not really the purpose of layers. Layers (called DIV's) are much more flexible than tables. You can't stack tables, you can't position them relatively or absolutely, and styling them with CSS is difficult. Tables are on the way out (for site structure purposes), as there is currently a very large push to build standards-based, accessible and usable sites, which you cannot do with tables.

As a quick example of what can be done, look at this site: http://www.janejosebizcom.com - no tables.

Getting standards-based design to work across all browsers is not as hard as people think, as is a hell of a lot easier than learning how to build a site using tables.

More:How to build a full CSS site

puca said the layers are being hidden and shown...
this effect wouldn't be capable in tables.
layers are by far the best way to go...
Bruski, its time to embrace the future! =)

Frank, I had a Netscape 5 beta.... but I quickly switched over to IE (for convenience)... I found NS5 somewhat bloated and slow to load... plus I think that was during the whole battle between NS and IE... <layer> was netscape's tag and <div> was IE's... i figured MS's code was widely embraced... so i made the switch... [lol, a little history rant]

puca, back to your question... I agree with frank, stumpy, and bruski... focus more on modern browsers... although I think IE4 is still around, IE5/6, Mozilla/Firebird and Opera are definately where to go...

btw, quite the unique site... =)

Hehe - unique is right.
The reason I suggested FireBird is not because I like it (which I do), but because it is probably the most standards-compliant browser available at the moment. The best way to design these days is to design using standards-based methods, in a browser which properly supports them, then work your way down... to IE.

thanks for the response guys!

I testes my site in firebird and i got the same problem! So if this browser represent standard-compliant browsers, shouldn't i get it to work out in this browser?

does anyone know a way to make a layer relative to a specific other layer? because i think that's where the problem is. correct me if i'm wrong please

To make a layer relative to a specific other layer, just nest it and give it absolute positioning and coordinates. It'll be relative to the layer it's nested in, which can also be absolutely positioned. I've had great results doing this in IE and Mozilla.

Wouldn't you give it relative positioning? i.e. position: relative... plus give it co-ords

but i do use nested layers and in mozilla this goes wrong. Could anybody out there with great css knowledge please check the source code and tell me what i can change?

thanks a lot

Have a look at my site - I use a tableless design, which uses hide/show layers, and it's fully XHTML 1.0 compliant.
http://www.bluesix.com.au

everyones ganging up on me ... i didnt mean they were bad i just said for a beginner they can be somewhat frustrating . CSS btw is great, and if you combine everything together you can make very nice websites. THere are alot of resources, dont just limit yourself to one or two

I've always figured relative positioning invalidated the whole prospect of having coordinates. I've developed several Windows-like Web apps in the past year that I've used CSS to lay out. Typically, I have an absolutely-positioned div named "main" that has a gray background and gray/white borders for a 3D effect. Within that, I've got a form grouped into subforms (a la windows, with a little blue title bar and a border around each subform). Each subform is an absolutely positioned div (within main) containing two divs of its own -- one for the title and one for the content; each of these sub-sub-divs is also absolutely positioned. For example, if I give the title div within a subform div an x coordinate of 10px, it shifts over 10 pixels and has a nice little offset.

There are probably other ways to do this using relative positioning, but I find the absolute positioning to give me maximum flexibility (if not fluid design).