On 2008-11-15, GTalbot <newsgroup@gtalbot.orgwrote:
Quote:
Hello fellow comp.infosystems.www.authoring.stylesheets colleagues,
>
Imagine this situation:
>
#grand-parent-abs-pos
{
height: 400px;
position: absolute;
width: 600px;
}
>
#parent-abs-pos
{
height: 0px;
left: 50%; /* 50% x 600px == 300px */
position: absolute;
top: 25%; /* 25% x 400px == 100px */
width: 0px;
}
>
#green-child-abs-pos-inherit
{
background-color: green;
left: inherit;
position: absolute;
top: inherit;
height: 100px;
width: 100px;
}
>
My questions:
1- What should be the computed left offset value of the #green-child-
abs-pos-inherit?
>
2- Should it inherit "left: 50%" or "left: 300px"?
|
It should inherit 50% (i.e. be 50% of *its* container).
Quote:
3- In other words, should it inherit the parent's *specified* left
offset value (50%) or the parent's *computed* left offset value
(300px)?
|
The computed value is 50%. The *used* value is what's 300px. It inherits
the computed value.
See CSS 2.1 9.3.2:
Computed value: [...] if specified as a length, the corresponding
absolute length; if specified as a percentage, the specified value;
otherwise, 'auto'.
See 6.1 for the definitions of specified, computed and used values.
(There is much confusion here when it comes to the DOM getComputedStyle
method. The DOM spec says it means "computed" as per CSS2 but as far as
I remember CSS2 [as opposed to 2.1] didn't distinguish properly between
computed and used. In many browsers getComputedStyle returns used values
for some things but they seem to be moving towards returning more
computed values in newer releases.)
