[Techtalk] CSS absolute positioning and overflow:hidden

[Shirrell]

Akkana Peck wrote:

>Oh CSS gurus: I'm working on a Javascript project involving
>animation, but I'm running into a snag involving CSS and absolute
>positioning.
>
>The problem is that I want to position some images inside a
>box on a page.  Here's my test page:
>    http://shallowsky.com/bugs/absolute/
>
>I have a containing div (indicated by the inset border) which
>contains a little text plus two flower images. The flower images
>are style="position: absolute; left: 150px; top: 10px;" for the
>first flower, and the same with "left: 450px" for the second.
>
>All the references I've found say that absolute coordinates
>are relative to the containing element, so that "top: 10px"
>should put the top of the flowers inside the div. But instead
>I'm seeing them placed relative to the whole page.
>  
>
It you place a style section before the </head> which contains something 
like:

<style
one { position: absolute: left:150px; top:10px; }
two { position: absolute: left:450px: top:10px; }

</div>

</style>

and then use somethinkg like:

 <img class="one" src="flower1.gif"  alt=""/>
 <img class="two" src="flower2.gif" alt=""/>

the images appear inside the containing box.

Shirrell at pstat.com