Chapter 10 - Visual formatting model details - 10.3.9 'Inline-block', non-replaced elements in normal flow
Go to the relevant page of the specification.
- absolute-non-replaced-width-017 (ahem)
-
'shrink-to-fit' width of absolutely positioned, non-replaced elements - direction (left-to-right), inline-block and max-width
When direction is left-to-right and 'left' is set to static position and 'width' and 'right' are 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is also given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If width of an absolutely positioned, non-replaced element resorts to 'shrink-to-fit' width calculation but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - absolute-non-replaced-width-018 (ahem)
-
'shrink-to-fit' width of absolutely positioned, non-replaced elements - direction (left-to-right), inline-block and max-width
When direction is left-to-right and 'left' is set to static position and 'width' and 'right' are 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is also given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If width of an absolutely positioned, non-replaced element resorts to shrink-to-fit width calculation but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - absolute-non-replaced-width-021 (ahem)
-
'shrink-to-fit' width of absolutely positioned, non-replaced elements - direction (right-to-left), inline-block and max-width
When direction is right-to-left and 'right' is set to static position and 'width' and 'left' are 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is also given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If width of an absolutely positioned, non-replaced element resorts to 'shrink-to-fit' width calculation but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - absolute-non-replaced-width-022 (ahem)
-
'shrink-to-fit' width of absolutely positioned, non-replaced elements - direction (right-to-left), inline-block and max-width
When direction is right-to-left and 'right' is set to static position and 'width' and 'left' are 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is also given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If width of an absolutely positioned, non-replaced element resorts to 'shrink-to-fit' width calculation but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - float-non-replaced-width-007 (ahem)
-
'shrink-to-fit' width of floating, non-replaced elements - inline-block and max-width
If 'width' of a floating, non-replaced element computes to 'auto' or 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If 'width' of a floating, non-replaced element computes to 'auto' but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - float-non-replaced-width-011 (ahem)
-
'shrink-to-fit' width of floating, non-replaced elements - inline-block and max-width
If 'width' of a floating, non-replaced element computes to 'auto' or 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If 'width' of a floating, non-replaced element computes to 'auto' but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - inline-block-001
-
inline-block: ping test
- inline-block-002 (interact)
-
inline-block: width
- inline-block-003 (interact)
-
inline-block: width
- inline-block-004 (interact)
-
inline-block: width
- inline-block-005 (interact)
-
inline-block: width
- inline-block-non-replaced-width-001 (ahem)
-
Inline-block non-replaced elements shrink-to-fit
If 'width' is 'auto' then 'inline-block' elements shrink-to-fit. - inline-block-non-replaced-width-002 (ahem)
-
Inline-block non-replaced elements with 'margin-left' and 'margin-right' set to 'auto'
When 'margin-left' and 'margin-right' are set to 'auto' the used value becomes '0'. - inline-block-non-replaced-width-003 (ahem)
-
'shrink-to-fit' width of inline-block non-replaced elements - max-width
If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto' but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - inline-block-non-replaced-width-004 (ahem)
-
'shrink-to-fit' width of inline-block non-replaced elements - max-width
If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto', then the used value of 'width' is given by 'shrink-to-fit' width calculation. If 'width' of an inline-block, non-replaced element in normal flow is given by 'shrink-to-fit' width calculation, then such calculated width can be furthermore constrained, reduced by a max-width declaration. If 'width' of an inline-block, non-replaced element in normal flow computes to 'auto' but its own child uses a constrained length resulting from a max-width declaration, then such constrained length will define the preferred width in 'shrink-to-fit' width calculation. - inline-block-width-001a
-
Test for 'width: auto' on inline-block
- inline-block-width-001b
-
Test for 'width: auto' on inline-block
- inline-block-width-002a
-
Test for 'width: auto' on inline-block
- inline-block-width-002b
-
Test for 'width:
' on inline-block