Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Layers within tables?

Posted by: mcadmin Mar 27 2007, 11:05 AM

I have some layers that I need because I'm using them in conjunction with a show/hide function. However, I only know how to create layers in "position:absolute". Every time I alter this latter part, it takes away the functionality of the layer. Rather than have the layers in a fixed position on the overall page, I want to have them always appear with in a table. Can anyone help me on this?

Posted by: pandy Mar 27 2007, 12:14 PM

I tell you only if you promise to get rid of he table. happy.gif

An absolutely positioned box doesn't need to be positioned relative the browser window. It's positioned relative its "containing block". The containing block for an absolutely positioned box is its closest ancestor with a position other than static.


If we have this HTML

HTML
<div id="outer">
<div id="inner"></div>
</div>


with this CSS
CODE
#outer    { margin-top: 200px;
            width: 400px; height: 400px;
            background: yellow }
#inner    { width: 50px; height: 50px;
            background: red;
            position: absolute; top: 0; left: 0 }


you'd expect the red square to be in the top left corner of the page and there's where it is. Now add the below line to the CSS and look again.
CODE
#outer    { position: relative }


http://www.w3.org/TR/CSS2/visudet.html#containing-block-details

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)