When you give an element position: absolute but do not apply top, left, right, or bottom to it, you seem to get a different result depending on the browser. Is there actually a prescribed behavior for this in the W3C standards? I haven't been able to find one.
position:absolute with no other positioning properties
Collapse
X
-
that will hardly be possible, since top, left, right & bottom are needed to position the element.
welcome to the wonderful world of standard implementations and IE hacks.
Visual formatting model
regards -
Maybe it wasn't intended to be possible, but . . .
A List Apart: Articles: Suckerfish Dropdowns
So these guys are saying that only IE needs top and left to position the element properly. In trying to adapt this menu design, I've found that even if I remove the position:relati ve from the parent element, the absolutely positioned elements stay near it unless I apply top, left, etc. to them--even though their containing block is now the whole page.Originally posted by Patrick Griffiths and Dan WebbThe next step is to tackle the second-level lists that will be the dropdowns themselves:
. . .Code:li ul { display: none; position: absolute; top: 1em; left: 0; }
you will see the need for the top and left properties in Internet Explorer, because without them, IE will align the second-level lists to the top right of their relative parent rather than the bottom left. Unfortunately, this IE fix will mess things up in browsers like Opera, so add the following CSS to reset the top and left properties on all but IE browsers:
Code:li > ul { top: auto; left: auto; }
It would seem logical to me for the "auto" position for an absolutely positioned element to be the upper left corner of its containing block, but that doesn't seem to be the case. I've spent quite a while looking through the W3C visual formatting model page, and I still can't find any articulated standard for this.Comment
-
you should have added, that you have problems with the suckerfish dropdown.... (well, well, coding could be easier without IE (*sigh*)) maybe this article can help a bit: Son of Suckerfish Dropdowns | HTML Dog
regards
note: nevertheless, I got my suckerfish dropdown working....
maybe you can find something here (search required): MDCComment
-
Absolutely positioned elements are automatically removed from the normal flow and will position themselves relative to the next positioned element, no matter what that is. So not using top, left, etc. is defined by that. Removing 'relative' doesn't change its positioning because it becomes the default 'static'.
I haven't looked at Suckerfish stuff in a long time but I thought I read that it's not very relevant in a standards world nowadays. Maybe I misread it.Comment
Comment