If ’width’ is specified as
’auto’, its value is the element’s intrinsic [p. 30] width. If one of the margins is
’auto’, its computed value is given by the constraints [p. 134] above. Further-
more, if both margins are ’auto’, their computed values are equal.
10.3.5 Floating, non-replaced elements
If ’left’, ’right’, ’width’, ’margin-left’, or ’margin-right’ are specified as ’auto’, their
computed value is ’0’.
10.3.6 Floating, replaced elements
If ’left’, ’right’, ’margin-left’ or ’margin-right’ are specified as ’auto’, their computed
value is ’0’. If ’width’ is ’auto’, its value is the element’s intrinsic [p. 30] width.
10.3.7 Absolutely positioned, non-replaced elements
The constraint that determines the computed values for these elements is:
’left’ + ’margin-left’ + ’border-left-width’ + ’padding-left’ + ’width’ +
’padding-right’ + ’border-right-width’ + ’margin-right’ + ’right’ = width of
containing block [p. 131]
(If the border style is ’none’, use ’0’ as the border width.) The solution to this constraint is reached through a number of substitutions in the following order:
1. If ’left’ has the value ’auto’ while ’direction’ is ’ltr’, replace ’auto’ with the
distance from the left edge of the containing block to the left margin edge of a hypothetical box that would have been the first box of the element if its
’position’ property had been ’static’. (But rather than actually computing that
box, user agents are free to make a guess at its probable position.) The value is negative if the hypothetical box is to the left of the containing block.
2. If ’right’ has the value ’auto’ while ’direction’ is ’rtl’, replace ’auto’ with the
distance from the right edge of the containing block to the right margin edge of the same hypothetical box as above. The value is positive if the hypothetical box is to the left of the containing block’s edge.
135
3. If ’width’ is ’auto’, replace any remaining ’auto’ for ’left’ or ’right’ with ’0’.
4. If ’left’, ’right’ or ’width’ are (still) ’auto’, replace any ’auto’ on ’margin-left’ or
’margin-right’ with ’0’.
5. If at this point both ’margin-left’ and ’margin-right’ are still ’auto’, solve the
equation under the extra constraint that the two margins must get equal values.
6. If at this point there is only one ’auto’ left, solve the equation for that value.
7. If at this point the values are over-constrained, ignore the value for either
’left’ (in case ’direction’ is ’rtl’) or ’right’ (in case ’direction’ is ’ltr’) and solve for
that value.
10.3.8 Absolutely positioned, replaced elements
This situation is similar to the previous one, except that the element has an intrin-
sic [p. 30] width. The sequence of substitutions is now:
1. If ’width’ is ’auto’, substitute the element’s intrinsic [p. 30] width.
2. If ’left’ has the value ’auto’ while ’direction’ is ’ltr’, replace ’auto’ with the
distance from the left edge of the containing block to the left margin edge of a hypothetical box that would have been the first box of the element if its
’position’ property had been ’static’. (But rather than actually computing that
box, user agents are free to make a guess at its probable position.) The value is negative if the hypothetical box is to the left of the containing block.
3. If ’right’ has the value ’auto’ while ’direction’ is ’rtl’, replace ’auto’ with the
distance from the right edge of the containing block to the right margin edge of the same hypothetical box as above. The value is positive if the hypothetical box is to the left of the containing block’s edge.
4. If ’left’ or ’right’ are ’auto’, replace any ’auto’ on ’margin-left’ or ’margin-right’
with ’0’.
5. If at this point both ’margin-left’ and ’margin-right’ are still ’auto’, solve the
equation under the extra constraint that the two margins must get equal values.
6. If at this point there is only one ’auto’ left, solve the equation for that value.
7. If at this point the values are over-constrained, ignore the value for either
’left’ (in case ’direction’ is ’rtl’) or ’right’ (in case ’direction’ is ’ltr’) and solve for
that value.
10.4 Minimum and maximum widths: ’min-width’
and ’max-width’
’min-width’
Value:
<length> | <percentage> | inherit
Initial:
UA dependent
Applies to:
all elements except non-replaced inline elements and table
elements
Inherited:
no
Percentages: refer to width of containing block
Media:
visual
136
’max-width’
Value:
<length> | <percentage> | none | inherit
Initial:
none
Applies to:
all elements except non-replaced inline elements and table
elements
Inherited:
no
Percentages: refer to width of containing block
Media:
visual
These two properties allow authors to constrain box widths to a certain range.
Values have the following meanings:
<length>
Specifies a fixed minimum or maximum computed width.
<percentage>
Specifies a percentage for determining the computed value. The percentage
is calculated with respect to the width of the generated box’s containing
block [p. 96] .
none
(Only on ’max-width’) No limit on the width of the box.
W trosce o komfort korzystania z naszego serwisu chcemy dostarczaĐ⥠Ci coraz lepsze usĐâugi. By mĐŃc to robiĐ⥠prosimy, abyĐâş wyraziĐâ zgodĐ⢠na dopasowanie treĐâşci marketingowych do Twoich zachowaĐâ w serwisie. Zgoda ta pozwoli nam czĐâ˘Đâşciowo finansowaĐ⥠rozwĐŃj Đâşwiadczonych usĐâug.
PamiĐâ˘taj, ĐŃe dbamy o TwojĐ⌠prywatnoĐâşĐâĄ. Nie zwiĐâ˘kszamy zakresu naszych uprawnieĐâ bez Twojej zgody. Zadbamy rĐŃwnieĐŃ o bezpieczeĐâstwo Twoich danych. WyraĐŃonĐ⌠zgodĐ⢠moĐŃesz cofnĐâŚĐ⥠w kaĐŃdej chwili.