Sent by Nick Boalch on 20 October 2003 20:08
Big John wrote:
>> I see an intermittent problem in Gecko-based browsers.
>> (The div #side here is positioned absolutely inside the #container div, but
>> Gecko here seems to position it inside the #content div.)
>
> This is Gecko. I've seen it have trouble with table/div combos before.
> You can easily fix this by moving div#side up above the first table.
Thanks for this advice. This does indeed fix the problem in Gecko. However, it
introduces a new one in Opera and IE!
The structure to the markup is now:
<div#container> { position: absolute; }
<div#content>
Some content
<div#side> { position: absolute; width: 25%; }
</div#side>
Tabular content
</div#content>
</div#container>
instead of the previous structure:
<div#container> { position: absolute; }
<div#content>
Some content
Tabular content
</div#content>
<div#side> { position: absolute; width: 25%; }
</div#side>
</div#container>
As I understand positioning (poorly!), an absolutely positioned element should
be positioned with respect to any parent element with position: absolute; (in
this case, div#container) or, in the absence of this, to the viewport.
All of my test browsers position div#side correctly inside div#container; IE
and Opera, however, seem to calculate the width: 25%; based on the width of
div#side's immediate parent, div#content, rather than div#container.
Is there any way around this?
I really don't want to put the content of div#side first in the document, (if
I did I'd just have floated it right instead of messing about with absolute
posititioning!) because that won't make any logical sense when viewed in a
text-only browser or read with a screenreader.
Regards,
N.
--
Nick Boalch, Research Student
School of Modern European Languages Tel: +44 (0) 191 334 5780
University of Durham Fax: +44 (0) 191 334 5770
New Elvet, Durham DH1 3JT, UK WWW: http://nick.frejol.org/
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
