Topic: Absolute within relative float (Page 1 of 1)

Alright, I'm either way off-base, or out of my tree - or I'm onto something (rather than "on" something) here.

Is it possible to have absolutely-positioned content with a floated element, in the same way you can normally nest absolute within relative?

ie.

<div style="position:relative;float:right;width:128px;height:128px;padding:5px;border:1px solid #333399">

 floated container 1 (relative)

 <div style="position:absolute;left:40px;top:35px;width:80px;height:80px;padding:5px;border:1px solid #333333">

  nested absolutely-positioned text 1

 </div>

</div>





<div style="margin-top:10px;float:right;width:128px;height:128px;padding:5px;border:1px solid #333399;clear:both">

 floated container 2 (no relative)

 <div style="position:absolute;left:10px;top:10px;width:80px;height:80px;padding:5px;border:1px solid #333333">

  nested absolutely-positioned text 2

 </div>

</div>

Lengthy inline styles for borders etc. to clarify the visual.

This works in IE 5.0, 5.5 and 6 without issue (although I know IE has many float-related bugs and doesn't support the standards even correctly) as well as in Phoenix 0.6 / Firebird 0.8, but fails in Netscape 6.0 to 7.0 (maybe 7.1 too?), Mozilla 1.4, Phoenix 0.5 and Opera 7. (Those are all on one machine.. damn, I have a lot of browsers installed!)

I know the display property is supposed to be ignored by browsers when float is applied. Is the same supposed to be true for "position"? Is there an accepted standard method of absolute positioning within floated elements?

I would assume it centers around floating elements being taken out of the usual "flow" of a document, but it's then inconsistent in behavior as the newest browsers seem to support the above method.

?