Closed
Bug 172823
Opened 22 years ago
Closed 22 years ago
position:absolute div is positioned to viewport
Categories
(Core :: CSS Parsing and Computation, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 105286
People
(Reporter: bugzilla, Assigned: dbaron)
References
()
Details
User-Agent: Mozilla/5.0 (Windows; U; WinNT4.0; en-US; rv:1.2b) Gecko/20021003
Build Identifier: Mozilla/5.0 (Windows; U; WinNT4.0; en-US; rv:1.2b) Gecko/20021003
i have this position: absolute div in my page that i positioned with right:
10px; and bottom: 0px; to get it in the lower bottom of the page. however, it
shows up half way.
it shows up at the bottom of the viewport, as if i said position: fixed. but
then, it isn't fixed, since when you scroll down the divs moves along with the page.
if you take a look at the URL, it's the 'lastmodified' div.
i'll attach a few screenshots.
Reproducible: Always
Steps to Reproduce:
1.
2.
3.
|
||
Comment 1•22 years ago
|
||
what happends if you change :
"div.lastmodified {" to ".div.lastmodified {" ?
|
|
||
Comment 2•22 years ago
|
||
and don't forget to reload with "shift+reload" or clearing the cache...
then the whole thing moves to the bottom left, and is displayed normal size,
normal font.
which is quite logical, since it wouldnt match 'class="lastmodified"'.
Not a bug. The position of an absolutely positioned element is
relative to the position of its nearest _positioned_ ancestor.
That would be the <html> element (= the viewport).
To get the desired effect, try adding
body {
position: absolute;
top: 0;
left: 0;
}
to your stylesheet.
then why does the CSS2 spec say this:
http://www.w3.org/TR/CSS2/visuren.html#propdef-position
"The box's position (and possibly size) is specified with the 'left', 'right',
'top', and 'bottom' properties. These properties specify offsets with respect to
the box's containing block."
The containing block is the <body> tag.
However, if I follow your reasoning (which seems, reading the specs and examples
for the gazillionth time) fairly correct, where does it state that <html> =
viewport? If you continue this line of reasoning, doesn't position: absolute
becomes position:fixed? why isn't <html> the *complete* document?
(oh, and why the hell doesnt 'text-align: right' anymore if i try your suggestion?)
Remember me that I file a bug against Opera :)
Re: comment 5
Your CSS2 quote is obviously correct.
However, although it may seem otherwise, <body> is not really the containing
block because in the case of absolutely positioned elements, a different
definition of the term needs to be applied.
The CSS2 spec says (9.8.4):
"The containing block for a positioned box is established by
the nearest positioned ancestor (or, if none exists, the
initial containing block [...])".
<body> is (by default) not positioned so it's not the containing block here.
<html> is, I don't know whether it's because it's implicitly positioned or
because it just happens to be the initial element. Anyway, that's why your
<div> is positioned relative to <html>. And since it's "absolute" and not
"fixed", it moves along when scrolling the page.
Also, <html> IS the entire document. I guess you can think of it as having
an implicit "overflow: scroll" style.
|
|
||
Comment 7•22 years ago
|
||
-> dbaron
Assignee: attinasi → dbaron
Component: Layout → Style System
QA Contact: petersen → ian
|
||
Comment 8•22 years ago
|
||
> That would be the <html> element (= the viewport).
Nope. The viewport is not the root element; it's just a viewport onto the
drawing canvas (this is much more obvious in paged media than in screen media --
there each page is a separate viewport, effectively).
> I guess you can think of it as having an implicit "overflow: scroll" style.
Nope. The viewport scrollbar has nothing to do with the root element.
*** This bug has been marked as a duplicate of 105286 ***
Status: UNCONFIRMED → RESOLVED
Closed: 22 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•