Layers in Netscape 4.7

[red emma]

Hi,

I'm pulling out my hair trying to size layers in Netscape 4.7 What gets rendered in the browser is a corectly positioned layer in accordance to the "left" and "top" css attributes, but the "width" of the layer colapses to the longest line of text. It renders just fine in IE 5. The code is as follows:

<div id="mainlayer" class="body" style="position:absolute; left:180px; top:139px; width:250px; z-index:1; visibility:visible">..text...</div>

You can see an example of the page at http://ise.tao.ca/test/index_main_nn.html

Any suggestions on how to fix this would be greatly apprecaited.

Michael Caplan

[Hierophant]

The only fix for this would be to add clipping to your styles. The collapsing behavior is by design in Netscape Navigator.

[red emma]

Wayne,

Thank you for the tip. I can't for the life of me figure out how to correctly add clipping to the example I gave above. Never used it before. What I have tried, is variations of this:

<div id="mainlayer" class="body" style="position:absolute; left:180px; top:139px; width:250px; z-index:1; visibility:visible; clip: rect(30px, 30px, 30px, 30px);">

What get's rendered is a blank layer.

Thank you,

Michael

Originally posted by W. Luke
The only fix for this would be to add clipping to your styles. The collapsing behavior is by design in Netscape Navigator.

[Hierophant]

Use clip instead of clipping..

clip: rect (<top> <right> <bottom> <left>)

Top and Left are respective to your containing layer. So if you want it to show the whole layer you would use

clip: rect(0,250,<height of layer here>,0).

Since you don't know the height of your layer you can set your style to overflow the contents as well..

overflow:visible - Makes all content visible
overflow:scroll - Should build scrollbars within your clipped area.
overflow:hidden - hides overflow and gives no way to access it.
overflow:auto - Browser dependant action but should build scroll bars if needed.

For an exact layout, Scroll or hidden are the best options. You can also use a little Javascript to build your own custom scrollbars that integrate into your site instead of the ugly OS generated ones. Check out the Scriptorium at http://www.bratta.com for examples on how to do this.

[lynlimz]

Juz alittle note..Layers ain't supported in the upcoming version.....you most likely would face issues of incompatibilityif you use layers

[red emma]

Huh?

You meen the layer or ilayer element, as opposed to layers?

[lynlimz]

yup
mozilla doesn't support layers.....
they will be emphasing on better scriptng technologies like DOM, style sheets, etc. and dropping backward ones..

the new netscape will not backward compatible with version 4.0 and below.

[red emma]

Wayne,

Thanks for the suggestions. This is what i did:

style="position:absolute; left:180px; top:139px; width:250px; clip: rect(0,250,250,0); z-index:1; overflow:visible; visibility:visible"

You can check the complete code if you like at: http://ise.tao.ca/test/index_main_nn.html

Unfortunatly, the clipping only worked for clipping off the bottom of the layer (250), and did not prevent the layer from collapsing in on its self. Any other ideas?

Thanks,

Michael