[thelist] Question: Netscape and positioned divs

[s t e f]

So.

Here's one of those insoluble problems we all love, and guess what, it's 
got Netscape written all over it.

I'm asked to optimize the display speed for a page so far laid out with 
tables. Since our content is pretty heavy I'm trying to put everything in 
divs, using both absolute and relative positioning. Hence ideally the 
content will be displayed before right and left navigation bars.

The basic structure can be seen here (the old page, all tables):
http://www.ridingzone.com/Rz/site2/air/

Now what I'm doing is:
Put the header in one absolute-positioned div. then put all the content in 
a relative-positioned div (otherwise Netscape wouldn't display scrollbars), 
within which I created three absolute-positioned divs.

Basically my code looks as follows (spaces added for this mail's sake):

< div id="containerDiv" style="position:relative; top:155px; left:0px; ">
     < div id="middleDiv"
         style="position:absolute; top:0px; left:170px; width:444px; 
z-index:10">
     < cfinclude template="_optim/zone3.cfm">
     < /div>

     < div id="rightDiv"
         style="position:absolute; top:0px; left:636px; width:160px; 
z-index:11">
     < cfinclude template="_optim/zone4.cfm">
     < /div>

     < div id="leftDiv"
         style="position:absolute; top:0px; left:0px; width:144px; z-index:12">
     < cfinclude template="_optim/zone2.cfm">
     < /div>

< /div>

The display looks just fine in IE.
However in Netscape middleDiv is correctly positioned, but then rightDiv 
and leftDiv are positioned 170px too far on the right, as if they used 
middleDiv as a reference of what left:0px would mean. Here:
http://www.ridingzone.com/Rz/site2/air/_optim_apres.cfm

The crasiest thing is if I move leftDiv and rightDiv up in my code, before 
the middleDiv, everything is placed correctly. See:
http://www.ridingzone.com/Rz/site2/air/_optim_correct_in_nn.cfm

(NB: note that the source code is not easily readable due the the CFM code 
behind. I'll work on it later on, first things first.)
Anybody has a clue as to how to solve this nagging little thingy?

FYI, this attempt at layout is based on Jeff Veen's excellent article "The 
Illusion of Speed" http://www.alistapart.com/stories/speed/


s t e f