Overflow hidden not working

[smith.james0]

I can not get over flow hidden to work, can anyone point out my error?

 

http://jsfiddle.net/N9c25/

 

 

James

[Strider64]

Using position:relative; should do the trick:

 #scontainer {
     position: relative;
     overflow:hidden;
     height:300px;
     border-style:solid;
     border-color:red;
 }

[kicken]

The reason why is because setting an item to position: absolute; removes it from the flow, so your sun is no longer considered to be a child of your container. It gets put into the flow of the nearest positioned element, or the body if no other. By making your container position: relative; it becomes the nearest positioned element and so the sun continues to be a child of it and the overflow works properly.

[smith.james0]

Thanks for the reply