[thelist] [css] display:none

[Diego Barcia]

Hi,

> Trouble is that the div still pushes my content down, so I have had to
adjust the padding of my other (visible) page content. I was under the
impression that if i set it to display:none, and made it absolutely
positioned (thus taking it out of page flow) it would not affect the visible
portions of page content.

I think the css property 'display' refers always to an element that is on
the page flow of the document, thus the values 'block' or 'inline', they
point to something that is relative to the flow, otherwise 'inline' and
'block' would be equivalent to the 'visible' value of the visibility
property and there will not be any difference between them also. I think
using 'display' along with CSS-P or absolute positioning creates a CSS
conflict that could produce unexpected results. I'm not a css know-it-all
but I think that you could use the visibility property for the
absolute-positioned layer, which was the original purpose of that property
(separating DHTML Layers logic from page flow), and was first introduced in
NS4. Via JavaScript you can set this property getting the node of that DIV,
perhaps with 'document.getElementByID(LayerID)', and appending to that node
object, the following predefined properties: style.visibility = 'visible'.
'hidden' is the keyword for hiding the layer, and 'visible', the one for
displaying it. NS4 support this, and using it will avoid HTML graphic or
structural problems. Perhaps, if you need to show the layer or div only in
NS4, you could do and object detection in order to detect NS4 and only that
browser, and if that evaluates to true, you could show the layer:

[if the layer has the id 'Message']
if (document.layers) { // check if it is NS4; NS6 doesn't support this, so
you're safe
var Layer = document.getElementById('Message');
Layer.style.visibility = 'visible'; }

(this is one of the cases where we can see that not keeping JS backward
compatibility is'nt that bad)

And in the CSS stylesheet, set initially the visibility of that layer to
'hidden':
#Message {
    visibility: hidden; } etc

The JavaScript code must be executed after the page is loaded, otherwise the
parser would not be able to find a tag with that id before the body of the
document loads, throwing an error.

regards,
Diego.
http://sci-web.com.ar