DOM

We could play further with the CSS:

#ourExample

{
display:none;
background-color:#ffffcc; color:#000000;
margin:solid thin #000000; padding:.5em;
top:6em; left:10%; width:80%;
position:absolute;
z-index:1;
}

</style>

position: absolute

The element's position will be fixed (absolutely) in the document object according to the element's own top and left styles. For instance, we can write an element into the bottom of the document body while we set the element's top and left styles so that it should appear at the top or in the middle or somewhere else, depending on the styles, when the document is displayed on screen.

z-index

The z-index arranges the display, so that an element that is positioned absolute with a higher z-index should appear over, on top of, an element with a lower z-index. Z-index 2 should appear over z-index-1. Z-index 3 should appear over 2, etc.

This should make our hidden element appear to float when it is displayed. Let's see . . .

Next >

< Previous

DOM

Methods

Coordination of Standards