Opera Browser Usage and Support Forum

While trying to relative position a div under overflow from another div, Opera 9 just won't budge.

here is a sample...

BODY {background-color:#ffffff;}
.cont {width:750px;height:100px;background-color:#00ff00;}
.focus {float:right;width:200px;height:100px;background-color:#999999;position:relative;top:30px;right:30px;z-index:10;}
.ft {height:100px;background:#ff0000;position:relative;top:-20px;}
.foot {width:750px;height:80px;background-color:#0000ff;}

<div class="cont">
<div class="focus"></div>
</div>
<div class="ft" align="center">
<div class="foot"></div>
</div>

class 'foot' will not move up with 'ft', it runs into 'cont' overflow which is 'focus'

in the above example, adding a fixed width to 'ft' seems to fix it, but width:auto, width:100%, or on my page with the div's full of code it still has no effect

I have tried adding containers with different floats, clears, positions, and some just stupid tricks, but no budge'in that darn thing.

overflow:hidden on 'cont' lets it move up, but that just defeats the whole thing.

The only thing I can think of at this point would be to use javascript to get the page width, but that would just be stupid. slow things down to much to call that contantly when the page is scrolled or changes width. I don't know if it would solve it anyway and don't feel like trying since I would not use it.

no problems in other browsers I have tried...
FF1.5+ on XP
IE6 on XP
OP6+7 on XP
Saf on OS10