From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Win95; en-US; rv:0.9.2) Gecko/20010628
When this page loads, the navigation box on the top right corner is placed at
the top of the page, rather than down a bit (1.5em) as is specified in the style
sheet (under body:margin-top).
When I move my cursor over one of the links in the navigation box, the whole box
jumps to its proper position.
Other pages on the same site have similar "jumps".
Steps to Reproduce:
1.load the page (http://www.magma.ca/~andyk/index.html)
2.move mouse over a link in the navigation box (top right corner)
Actual Results: navigation box jumps to new (proper) position
Expected Results: navigation box should have appeared in the "new" position
when it was first loaded.
The navigation box is created using "document.write" statements in an external
Opera 5.12 displays the page properly (without jumping).
The navigation box uses the CSS property "position : fixed".
Over to layout. This is a problem on build 2001-07-15-21 on Linux as well.
problem still there.
reassigning to core owner as this is not a table specific bug.
Andy, take a look at following sections of CSS2 spec:
The offset of the box has to be explicitly specified. Your stylesheet fails to
specify vertical offset of the box. margin-top: property is not inheritable, and
thus doesn't apply to your navigation box. Try applying top: property to your
box and see what happens.
This happens not only on mouseover, but also on window resize. While it is
obviously a result of improper style sheet, the browser behaviour in handling of
this case seems to differ during DOM insertion and during reflow.
Over to Style System.
This is a layout bug, not a style system bug, unless you're arguing that both
positions are incorrect.
David, is there a public version of the document you cite?
Anyway, it was just an email message from me to the WG list asking what should
happen with 'position: fixed' and 'top: auto', since the spec doesn't define it
well, plus a little general mumbling about whether 'top: auto' is really useful
at all given the difficulty of implementation...
Created attachment 63339 [details]
This site's address is http://www.cityofheroes.com/
The first time the page is loaded, some DIVs are rendered too much to the right
If you refresh the page, they go back to the intended position.
Created attachment 63341 [details]
This is the correct position
Another DIV wrongly displaced at http://cube.ign.com/
The positions are corrected only when the page is refreshed.
Neither of the sites in comment 10, comment 11, comment 12 uses fixed
positioning, so they have nothing to do with this bug (as a separate note, I
cannot reproduce those problems). I _can_ reproduce this problem.
I don't know if my CSS code is correct, but is it the same problem I have on
? If I move the mouse pointer quickly over Menu, then the menu is sometimes
displayed for a very short period slightly to the left or to the right. This
problem disappears if I don't use "position: fixed".
Note: don't use Mozilla 1.0 to test that (the menu won't appear), but a more
Created attachment 88065 [details]
Vincent, you're seeing something different (reflow lag of some sort?).
The minimal testcase is for the original bug report (reduced from
http://www.magma.ca/~andyk/index.html). The problem there is that the
stylesheet specifies none of top, bottom, height for the fixed-position div.
These properties do not have a useful initial value, so we can place the thing
where ever we feel like, really....
The only bug is that we don't place it _consistently_.
Created attachment 88091 [details]
more evil testcase (more like the site)
Created attachment 88094 [details] [diff] [review]
So the problem is that if neither of top and bottom is specified then the
fixed-pos element should have its top where it would be if the element were
statically positioned. So to position it properly we have to reflow the main
content, then position it. That's what this patch does. It fixes the minimal
testcase, but not the more evil one (where the <script> referencing an external
file kicks off a reflow that apparently does not flow the main content
correctly but does reflow the fixed-pos elements). It also does not fix the
original site this is reported against.
I can reproduce the problem with the two new testcases (no patch applied).
Note that the problem isn't only a display problem. If I add submenus, the whole
menu no longer works at all (perhaps because :hover no longer works as expected
because the position is temporarily incorrect). This is solved by either using
"position: absolute" (instead of fixed) or by swapping left and right.
I've moved the original "problem" site (without the fixed css) to http://www.magma.ca/~andyk/mozilla-test/index.html in case it's still needed.
I just came across these two pages
And one of them is wrong. Both share a position:fixed element, in fact both take
the same stylesheet. The second one doesn't look good. "Fixed positioning is
just like absolute positioning, except the containing block of a fixed element
is always the viewport". So according to this, the second link _IS_ doing the
right thing and the first one, is not, though it's the first one that looks right.
On modifying the second page by adding <br /> so as to make the page big enough
for a scroll to appear, the div gets repositioned as in the first link, which
though it looks good again, is not according to spec, I believe.
As to what I am using, 1.1beta build 2002080508 on Windows XP (all patched). I
have no control over the pages mentioned. I just happened to go visit that
I did check the code against style checkers (both html and css) and it should be
right. I post this here because it seems relevant and I don't fancy opening a
bug just like that. If anyone with a better grasp thinks it should go on a bug
by itself, might want to go ahead and add that new bug. I might also add this
comment to other bugs if I see it relevant. Just checking now. ;)
Of those two, the first link is correct. Note that "top" is not specified in
My "partial patch" fixes the second of those two links to look correct as well.
"Of those two, the first link is correct. Note that "top" is not specified in
Reading the specification (http://www.w3.org/TR/REC-CSS2/visuren.html#fixed-
positioning) for fixed positioning "the containing block is stablished by the
viewport." If that's so, the second link, while not looking good, is correct.
A top value should have been given in the css file to keep it from getting the
default top: 0px; In the first page the reason why the #NavBar is not at
top:0px is because the #NavBar is _NOT_ being "totally removed from the
documents's flow". It shouldn't have a position relative to any part of the
document. (From CSS: The Definitive Guide, by E. Meyer).
I guess the reason for this removal of the document flow is because if we
would keep it in it, and we would have that fixed positioned element coming up
later in the document, not showing on the first screen, but rather having to
scroll down to view it, it wouldn't make sense, would it? Would the fixed
positioned element, once it gets a hold of the viewport get stuck? Would it
keep scrolling? If so, why did we use the positioned element in the first
IE6 does show both pages like the first one does in Mozilla. I guess they got
that part wrong.
> A top value should have been given in the css file to keep it from getting the
> default top: 0px;
The default value of "top" is not 0px. It's "auto". See
http://www.w3.org/TR/REC-CSS2/visudet.html#abs-non-replaced-height for the rules
that govern layout in this case... The containing block is the viewport, and
rule #1 says what should be done when "top" is "auto".
IE6 is getting the layout exactly correct here.
You are right :)
I guess then that a position:fixed element that is not at the top of the html so
as to show in the viewport, as you hit the page, is not going to show at all,
unless the viewport can be resized to encompass the element's original
position... cool, fixed elements allow to have notices for those with screens of
1280x1024 that won't be viewable by those with a smaller screen, for example.
But what behavior is expected when a position:fixed element that is in the
middle of a long document (let's say 10 viewports long) is just preceeded by a
named anchor and the page has been called from a link with that anchor in it?
Does it show then?
I guess I think the meaning of 'top: auto' for fixed-positioned elements should
*** Bug 168771 has been marked as a duplicate of this bug. ***
This seems to be related to a question I just posted in the
I have a couple of test pages i'm working on to test out how to build certian
various components of websites i work on (tripod.com, angelfire.com,
htmlgear.com) into strict XHTML because i'm sick of doing 8-level nested tables
and watching them crash on netscape 4.
So i've been playing with CSS and XHTML and I'm geting the same problem. my DIV
tag (the only thing on the page, it's the containter the rest of the stuff
appears in) is appearing on the page about 5px south of the top of the browser
viewport, even though my body tag has margin: 0; and padding: 0;.
i've validated my CSS and XHTML as both proper CSS2 and XHTML Strict 1.0, so (i
hope!) it's not my code, AND in IE 5.2 (mac) and IE 6.0 (pc) the pages are
appearing correctly (the top of the div is butted right against the top of the
the page is:
i can replicate the mozilla bug in:
netscape 7.0 (mac os 9)
mozilla 1.2.1 (mac os 9)
mozilla 1.2.1 (mac os x)
mozilla 1.0.1 (pc)
is this the same bug, and if so, is it planned for fixing soon?
I don't think this is the same bug. In the original, the div jumped around on
One thing that may help (I'm not a css expert) is to place a "top: 0px;"
statement in your css file for the navigation bar.
Changing site submitted by Todd to http://www.selfassembled.net/divtest/
Todd, your div is not position:fixed, so has _nothing_ to do with this bug.
You want to set the <html> margin to 0.
Created attachment 112636 [details] [diff] [review]
updated partial patch
We should get this in; it fixes the common case of this bug... and it's the
right thing to do no matter what.
Created attachment 112637 [details]
slightly simpler more evil testcase
Comment on attachment 112636 [details] [diff] [review]
updated partial patch
takins so it stays on my radar....
roc says this is no-go for 1.3, so landing it in 1.4a.
The way I see it the problem in this bug is not any mouse-over issue, but a
general redraw upon any event that causes position to be recalculated, such as
resizing the window, the addition of a scrollbar, or a mouse-over action that
redraws the element. If this is the case, then Bug 158398 is a duplicate, and
the current summary is very misleading.
Mark Bug 158398 as duplicate?
Change summary to: "position:fixed elements in wring position until screen
positions re-calculated" ?
I'd rather keep it dependent as duplicate, because the patch here fixes that bug
but _not_ quite this one.
The summary is the one that describes the most common way to trigger this bug;
it may as well stay.
Created attachment 114372 [details] [diff] [review]
Merged to tip (includes fix for bug 192291)
In a fit of curiousity, I decided to check out what the value of "wasHandled"
was. Turns out that the incremental reflow code was not handling the "eviler"
This patch fixes all testcases attached to this bug and all dependent bugs.
Comment on attachment 114372 [details] [diff] [review]
Merged to tip (includes fix for bug 192291)
roc, how's about a repeat of that review? The only real change was the slight
logic tweak to do a real reflow if the incremental reflow does not get
I take it your interpretation of 'auto' doesn't involve adjusting for the scroll
position... that could be, erm, fun.
Er? "auto" means we position it to line up with the placeholder, unless the page is scrolled.
That's the only interpretation that really makes sense per spec, to me.
*** Bug 146303 has been marked as a duplicate of this bug. ***
*** Bug 158398 has been marked as a duplicate of this bug. ***
*** Bug 185119 has been marked as a duplicate of this bug. ***
*** Bug 193266 has been marked as a duplicate of this bug. ***
fixed for 1.4a.