HTML and CSS Reference
In-Depth Information
2. If both
left
and
right
are set to
auto
, then if
direction
is
ltr
, set
left
to the static
left position. If
direction
is
rtl
, set
right
to the static right position.
3. If either or both of
left
and
right
are set to
auto
, reset any
auto
values for
margin-
left
and
margin-right
to
0
.
4. If neither
left
nor
right
is set to
auto
and both
margin-left
and
margin-right
are set
to
auto
, solve the equation under the additional constraint that the two margins get equal
values.
5. If the values are overconstrained (none is set to
auto
), ignore the value for
left
if
dir-
ection
is
rtl
(ignore
right
if
direction
is
ltr
) and solve for that value.
Vertical layout of absolutely positioned elements
The equation that governs the layout of these elements is:
top + margin-top + border-top-width + padding-top + height
+ padding-bottom + border-bottom-width + margin-bottom +
bottom + horizontal scrollbar height (if any) =
height of containing block
The height of any horizontal scrollbar is determined by the user agent and cannot be affected
with CSS.
For nonreplacedelements, the steps used to determine vertical layout are:
1. If all of
top
,
height
, and
bottom
are
auto
, set
top
to the static position and apply the rule
given in step 3c.
2. If none of
top
,
height
, and
bottom
is
auto
, pick the one rule that applies from the fol-
lowing list:
a. If both
margin-top
and
margin-bottom
are set to
auto
, solve the equation under the
additional constraint that the two margins get equal values.
b. If only one of
margin-top
or
margin-bottom
is set to
auto
, solve the equation for
that value.
c. If the values are overconstrained (none is set to
auto
), ignore the value for
bottom
and solve for that value.
3. If some of
top
,
height
, and
bottom
are
auto
, but others are not, pick the one rule that
applies from the following list:
a. If
top
and
height
are
auto
and
bottom
is not, the height is based on the element's
content (as it would be in the static flow). Reset any
auto
values for
margin-top
and
margin-bottom
to
0
and solve the equation for
top
.
