Chapter 8 - Box model - 8.5.4 Border shorthand properties: 'border-top', 'border-right', 'border-bottom', 'border-left', and 'border'
Go to the relevant page of the specification.
- border-001
-
Border set using border-width
The 'border' shorthand property properly accepts and sets border-width. - border-002
-
Border set using border-style
The 'border' shorthand property properly accepts and sets border-style. - border-003
-
Border set using border-color
The 'border' shorthand property properly accepts and sets border-color. - border-004
-
Border set using border-width border-style
The 'border' shorthand property properly accepts and sets border-width and border-style. - border-005
-
Border set using border-width border-color
The 'border' shorthand property properly accepts and sets 'border-width' and 'border-color'. - border-006
-
Border set using border-style border-width
The 'border' shorthand property properly accepts and sets 'border-style' and 'border-width'. - border-007
-
Border set using border-style border-color
The 'border' shorthand property properly accepts and sets 'border-style' and 'border-color'. - border-008
-
Border set using border-color border-width
The 'border' shorthand property properly accepts and sets 'border-color' and 'border-width'. - border-009
-
Border set using border-color border-style
The 'border' shorthand property properly accepts and sets 'border-color' and 'border-style'. - border-010
-
Border set using border-width border-style border-color
The 'border' shorthand property properly accepts and sets 'border-width', 'border-style' and 'border-color'. - border-011
-
Border set using border-width border-color border-style
The 'border' shorthand property properly accepts and sets 'border-width', 'border-color' and 'border-style'. - border-012
-
Border set using border-style border-width border-color
The 'border' shorthand property properly accepts and sets 'border-style', 'border-width' and 'border-color'. - border-013
-
Border set using border-style border-color border-width
The 'border' shorthand property properly accepts and sets 'border-style', 'border-color' and 'border-width'. - border-014
-
Border set using border-color border-width border-style
The 'border' shorthand property properly accepts and sets 'border-color', 'border-width' and 'border-style'. - border-015
-
Border set using border-color border-style border-width
The 'border' shorthand property properly accepts and sets 'border-color', 'border-style' and 'border-width'. - border-016
-
Border set to 'inherit', inheriting one value
The 'border' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-017
-
Border set to 'inherit', inheriting two values
The 'border' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-018
-
Border set to 'inherit', inheriting three values
The 'border' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-applies-to-001
-
Border applied to element with 'display' set to 'table-row-group'
The 'border' property applies to elements with a display of 'table-row-group'. - border-applies-to-002
-
Border applied to element with 'display' set to 'table-header-group'
The 'border' property applies to elements with a display of 'table-header-group'. - border-applies-to-003
-
Border applied to element with 'display' set to 'table-footer-group'
The 'border' property applies to elements with a display of 'table-footer-group'. - border-applies-to-004
-
Border applied to element with 'display' set to 'table-row'
The 'border' property applies to elements with a display of 'table-row'. - border-applies-to-005
-
Border applied to element with 'display' set to 'table-column-group'
The 'border' property applies to elements with a display of 'table-column-group'. - border-applies-to-006
-
Border applied to element with 'display' set to 'table-column'
The 'border' property applies to elements with a display of 'table-column'. - border-applies-to-007
-
Border applied to element with 'display' set to 'table-cell'
The 'border' property applies to elements with a display of 'table-cell'. - border-applies-to-008
-
Border applied to element with 'display' set to inline
The 'border' property applies to elements with a display of inline. - border-applies-to-009
-
Border applied to element with 'display' set to block
The 'border' property applies to elements with a display of block. - border-applies-to-010
-
Border applied to element with 'display' set to list-item
The 'border' property applies to elements with a display of list-item. - border-applies-to-012
-
Border applied to element with 'display' set to inline-block
The 'border' property applies to elements with a display of inline-block. - border-applies-to-013
-
Border applied to element with 'display' set to 'table'
The 'border' property applies to elements with a display of 'table'. - border-applies-to-014
-
Border applied to element with 'display' set to 'inline-table'
The 'border' property applies to elements with a display of 'inline-table'. - border-applies-to-015
-
Border applied to element with 'display' set to 'table-caption'
The 'border' property applies to elements with a display of 'table-caption'. - border-bottom-001
-
Border-bottom set to border-width
The 'border-bottom' shorthand property sets 'border-width' for the bottom border. - border-bottom-002
-
Border-bottom set to border-style
The 'border-bottom' shorthand property sets the 'border-style' for the bottom border. - border-bottom-003
-
Border-bottom set to border-color
The 'border-bottom' shorthand property sets the 'border-color' for the bottom border. - border-bottom-004
-
Border-bottom set to border-width border-style
The 'border-bottom' shorthand property sets the 'border-width' and 'border-style' for the bottom border. - border-bottom-005
-
Border-bottom set to border-width border-color
The 'border-bottom' shorthand property sets the 'border-width' and 'border-color' for the bottom border. - border-bottom-006
-
Border-bottom set to border-style border-width
The 'border-bottom' shorthand property sets the 'border-style' and 'border-width' for the bottom border. - border-bottom-007
-
Border-bottom set to border-style border-color
The 'border-bottom' shorthand property sets the 'border-style' and 'border-color' for the bottom border. - border-bottom-008
-
Border-bottom set to border-color border-width
The 'border-bottom' shorthand property sets the 'border-color' and 'border-width' for the bottom border. - border-bottom-009
-
Border-bottom set to border-color border-style
The 'border-bottom' shorthand property sets the 'border-color' and 'border-style' for the bottom border. - border-bottom-010
-
Border-bottom set to border-width border-style border-color
The 'border-bottom' shorthand property sets the 'border-width', 'border-style' and 'border-color' for the bottom border. - border-bottom-011
-
Border-bottom set to border-width border-color border-style
The 'border-bottom' shorthand property sets the 'border-width', 'border-color' and 'border-style' for the bottom border. - border-bottom-012
-
Border-bottom set to border-style border-width border-color
The 'border-bottom' shorthand property sets the 'border-style', 'border-width' and 'border-color' for the bottom border. - border-bottom-013
-
Border-bottom set to border-style border-color border-width
The 'border-bottom' shorthand property sets the 'border-style', 'border-color' and 'border-width' for the bottom border. - border-bottom-014
-
Border-bottom set to border-color border-width border-style
The 'border-bottom' shorthand property sets the 'border-color', 'border-width' and 'border-style' for the bottom border. - border-bottom-015
-
Border-bottom set to border-color border-style border-width
The 'border-bottom' shorthand property sets the 'border-color', 'border-style' and 'border-width' for the bottom border. - border-bottom-016
-
Border-bottom set to inherit, inheriting a single value for a shorthand property
The 'border-bottom' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-bottom-017
-
Border-bottom set to inherit, inheriting two values for a shorthand property
The 'border-bottom' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-bottom-018
-
Border-bottom set to inherit, inheriting three values for a shorthand property
The 'border-bottom' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-bottom-applies-to-001
-
Border-bottom applied to element with display table-row-group
The 'border-bottom' property applies to elements with a display of table-row-group. - border-bottom-applies-to-002
-
Border-bottom applied to element with display table-header-group
The 'border-bottom' property applies to elements with a display of table-header-group. - border-bottom-applies-to-003
-
Border-bottom applied to element with display table-footer-group
The 'border-bottom' property applies to elements with a display of table-footer-group. - border-bottom-applies-to-004
-
Border-bottom applied to element with 'display' set to 'table-row'
The 'border-bottom' property applies to elements with a 'display' of 'table-row'. - border-bottom-applies-to-005
-
Border-bottom applied to element with display table-column-group
The 'border-bottom' property applies to elements with a display of table-column-group. - border-bottom-applies-to-006
-
Border-bottom applied to element with display table-column
The 'border-bottom' property applies to elements with a display of table-column. - border-bottom-applies-to-007
-
Border-bottom applied to element with display table-cell
Border-bottom applies to elements with a display of table-cell. - border-bottom-applies-to-008
-
Border-bottom applied to element with display inline
The 'border-bottom' property applies to elements with a display of inline. - border-bottom-applies-to-009
-
Border-bottom applied to element with display block
The 'border-bottom' property applies to elements with a display of block. - border-bottom-applies-to-010
-
Border-bottom applied to element with display list-item
The 'border-bottom' property applies to elements with a display of list-item. - border-bottom-applies-to-012
-
Border-bottom applied to element with display inline-block
The 'border-bottom' property applies to elements with a display of inline-block. - border-bottom-applies-to-013
-
Border-bottom applied to element with 'display' set to 'table'
The 'border-bottom' property applies to elements with a 'display' of 'table'. - border-bottom-applies-to-014
-
Border-bottom applied to element with 'display' set to 'inline-table'
The 'border-bottom' property applies to elements with a 'display' of 'inline-table'. - border-bottom-applies-to-015
-
Border-bottom applied to element with 'display' set to 'table-caption'
The 'border-bottom' property applies to elements with a 'display' of 'table-caption'. - border-dynamic-001 (dom)
-
Dynamic Borders (style attribute)
- border-dynamic-002 (dom)
-
Dynamic Borders (class attribute)
- border-left-001
-
Border-left set to border-width
The 'border-left' shorthand property properly sets the border-width for the left border. - border-left-002
-
Border-left set to border-style
The 'border-left' shorthand property properly sets the border-style for the left border. - border-left-003
-
Border-left set to border-color
The 'border-left' shorthand property properly sets the border-color for the left border. - border-left-004
-
Border-left set to border-width border-style
The 'border-left' shorthand property properly sets the border-width and border-style for the left border. - border-left-005
-
Border-left set to border-width border-color
The 'border-left' shorthand property sets the 'border-width' and 'border-color' for the left border. - border-left-006
-
Border-left set to border-style border-width
The 'border-left' shorthand property sets the 'border-style' and 'border-width' for the left border. - border-left-007
-
Border-left set to border-style border-color
The 'border-left' shorthand property sets the 'border-style' and 'border-color' for the left border. - border-left-008
-
Border-left set to border-color border-width
The 'border-left' shorthand property sets the 'border-color' and 'border-width' for the left border. - border-left-009
-
Border-left set to border-color border-style
The 'border-left' shorthand property sets the 'border-color' and 'border-style' for the left border. - border-left-010
-
Border-left set to border-width border-style border-color
The 'border-left' shorthand property properly sets the 'border-width', 'border-style' and 'border-color'. - border-left-011
-
Border-left set to border-width border-color border-style
The 'border-left' shorthand property properly sets the 'border-width', 'border-color' and 'border-style'. - border-left-012
-
Border-left set to border-style border-width border-color
The 'border-left' shorthand property properly sets the 'border-style', 'border-width' and 'border-color'. - border-left-013
-
Border-left set with border-style border-color border-width
The 'border-left' shorthand property properly sets the 'border-style', 'border-color' and 'border-width'. - border-left-014
-
Border-left set to border-color border-width border-style
The 'border-left' shorthand property properly sets the 'border-color', 'border-width' and 'border-style'. - border-left-015
-
Border-left set to border-color border-style border-width
The 'border-left' shorthand property properly sets the 'border-color', 'border-style' and 'border-width'. - border-left-016
-
Border-left set to inherit, inheriting a single value for a shorthand property
The 'border-left' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-left-017
-
Border-left set to inherit, inheriting two values for a shorthand property
The 'border-left' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-left-018
-
Border-left set to inherit, inheriting three values for a shorthand property
The 'border-left' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-left-applies-to-001
-
Border-left applied to element with display table-row-group
The 'border-left' properties applies to elements with a display of table-row-group. - border-left-applies-to-002
-
Border-left applied to element with display table-header-group
The 'border-left' properties applies to elements with a display of table-header-group. - border-left-applies-to-003
-
Border-left applied to element with display table-footer-group
The 'border-left' properties applies to elements with a display of table-footer-group. - border-left-applies-to-004
-
Border-left applied to element with display table-row
The 'border-left' properties applies to elements with a display of table-row. - border-left-applies-to-005
-
Border-left applied to element with display table-column-group
The 'border-left' properties applies to elements with a display of table-column-group. - border-left-applies-to-006
-
Border-left applied to element with display table-column
The 'border-left' properties applies to elements with a display of table-column. - border-left-applies-to-007
-
Border-left applied to element with display table-cell
The 'border-left' properties applies to elements with a display of table-cell. - border-left-applies-to-008
-
Border-left applied to element with display inline
The 'border-left' properties applies to elements with a display of inline. - border-left-applies-to-009
-
Border-left applied to element with display block
The 'border-left' properties applies to elements with a display of block. - border-left-applies-to-010
-
Border-left applied to element with display list-item
The 'border-left' properties applies to elements with a display of list-item. - border-left-applies-to-012
-
Border-left applied to element with display inline-block
The 'border-left' properties applies to elements with a display of inline-block. - border-left-applies-to-013
-
Border-left applied to element with display table
The 'border-left' properties applies to elements with a display of table. - border-left-applies-to-014
-
Border-left applied to element with display inline-table
The 'border-left' properties applies to elements with a display of inline-table. - border-left-applies-to-015
-
Border-left applied to element with display table-caption
The 'border-left' properties applies to elements with a display of table-caption. - border-right-001
-
Border-right set to border-width
The 'border-right' shorthand property properly sets the border-width for the right border. - border-right-002
-
Border-right set to border-style
The 'border-right' shorthand property properly sets the border-style for the right border. - border-right-003
-
Border-right set to border-color
The 'border-right' shorthand property properly sets the border-color for the right border. - border-right-004
-
Border-right set to border-width border-style
The 'border-right' shorthand property properly sets the border-width and border-style for the right border. - border-right-005
-
Border-right set to border-width border-color
The 'border-right' shorthand property sets the 'border-width' and 'border-color' for the right border. - border-right-006
-
Border-right set to border-style border-width
The 'border-right' shorthand property sets the 'border-style' and 'border-width' for the right border. - border-right-007
-
Border-right set to border-style border-color
The 'border-right' shorthand property sets the 'border-style' and 'border-color' for the right border. - border-right-008
-
Border-right set to border-color border-width
The 'border-right' shorthand property sets the 'border-color' and 'border-width' for the right border. - border-right-009
-
Border-right set to border-color border-style
The 'border-right' shorthand property sets the 'border-color' and 'border-style' for the right border. - border-right-010
-
Border-right set to border-width border-style border-color
The 'border-right' shorthand property properly sets the 'border-width', 'border-style' and 'border-color'. - border-right-011
-
Border-right set to border-width border-color border-style
The 'border-right' shorthand property properly sets the 'border-width', 'border-color' and 'border-style'. - border-right-012
-
Border-right set to border-style border-width border-color
The 'border-right' shorthand property properly sets the 'border-style', 'border-width' and 'border-color'. - border-right-013
-
Border-right set with border-style border-color border-width
The 'border-right' shorthand property properly sets the 'border-style', 'border-color' and 'border-width'. - border-right-014
-
Border-right set to border-color border-width border-style
The 'border-right' shorthand property properly sets the 'border-color', 'border-width' and 'border-style'. - border-right-015
-
Border-right set to border-color border-style border-width
The 'border-right' shorthand property properly sets the 'border-color', 'border-style' and 'border-width'. - border-right-016
-
Border-right set to inherit, inheriting a single value for a shorthand property
The 'border-right' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-right-017
-
Border-right set to inherit, inheriting two values for a shorthand property
The 'border-right' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-right-018
-
Border-right set to inherit, inheriting three values for a shorthand property
The 'border-right' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-right-applies-to-001
-
Border-right applied to element with display table-row-group
The 'border-right' property applies to elements with a display of table-row-group. - border-right-applies-to-002
-
Border-right applied to element with display table-header-group
The 'border-right' property applies to elements with a display of table-header-group. - border-right-applies-to-003
-
Border-right applied to element with display table-footer-group
The 'border-right' property applies to elements with a display of table-footer-group. - border-right-applies-to-004
-
Border-right applied to element with display table-row
The 'border-right' property applies to elements with a display of table-row. - border-right-applies-to-005
-
Border-right applied to element with display table-column-group
The 'border-right' property applies to elements with a display of table-column-group. - border-right-applies-to-006
-
Border-right applied to element with display table-column
The 'border-right' property applies to elements with a display of table-column. - border-right-applies-to-007
-
Border-right applied to element with display table-cell
The 'border-right' property applies to elements with a display of table-cell. - border-right-applies-to-008
-
Border-right applied to element with display inline
The 'border-right' property applies to elements with a display of inline. - border-right-applies-to-009
-
Border-right applied to element with display block
The 'border-right' property applies to elements with a display of block. - border-right-applies-to-010
-
Border-right applied to element with display list-item
The 'border-right' property applies to elements with a display of list-item. - border-right-applies-to-012
-
Border-right applied to element with display inline-block
The 'border-right' property applies to elements with a display of inline-block. - border-right-applies-to-013
-
Border-right applied to element with display table
The 'border-right' property applies to elements with a display of table. - border-right-applies-to-014
-
Border-right applied to element with display inline-table
The 'border-right' property applies to elements with a display of inline-table. - border-right-applies-to-015
-
Border-right applied to element with display table-caption
The 'border-right' property applies to elements with a display of table-caption. - border-shorthands-001
-
border-color shorthand (basic)
- border-shorthands-002
-
border-color shorthand (basic)
- border-shorthands-003
-
border-color shorthand (basic)
- border-top-001
-
Border-top set to border-width
The 'border-top' shorthand property sets 'border-width' for the top border. - border-top-002
-
Border-top set to border-style
The 'border-top' shorthand property sets the 'border-style' for the top border. - border-top-003
-
Border-top set to border-color
The 'border-top' shorthand property sets the 'border-color' for the top border. - border-top-004
-
Border-top set to border-width border-style
The 'border-top' shorthand property sets the 'border-width' and 'border-style' for the top border. - border-top-005
-
Border-top set to border-width border-color
The 'border-top' shorthand property sets the 'border-width' and 'border-color' for the top border. - border-top-006
-
Border-top set to border-style border-width
The 'border-top' shorthand property sets the 'border-style' and 'border-width' for the top border. - border-top-007
-
Border-top set to border-style border-color
The 'border-top' shorthand property sets the 'border-style' and 'border-color' for the top border. - border-top-008
-
Border-top set to border-color border-width
The 'border-top' shorthand property sets the 'border-color' and 'border-width' for the top border. - border-top-009
-
Border-top set to border-color border-style
The 'border-top' shorthand property sets the 'border-color' and 'border-style' for the top border. - border-top-010
-
Border-top set to border-width border-style border-color
The 'border-top' shorthand property sets the 'border-width', 'border-style' and 'border-color' for the top border. - border-top-011
-
Border-top set to border-width border-color border-style
The 'border-top' shorthand property sets the 'border-width', 'border-color' and 'border-style' for the top border. - border-top-012
-
Border-top set to border-style border-width border-color
The 'border-top' shorthand property sets the 'border-style', 'border-width' and 'border-color' for the top border. - border-top-013
-
Border-top set to border-style border-color border-width
The 'border-top' shorthand property sets the 'border-style', 'border-color' and 'border-width' for the top border. - border-top-014
-
Border-top set to border-color border-width border-style
The 'border-top' shorthand property sets the 'border-color', 'border-width' and 'border-style' for the top border. - border-top-015
-
Border-top set to border-color border-style border-width
The 'border-top' shorthand property sets the 'border-color', 'border-style' and 'border-width' for the top border. - border-top-016
-
Border-top set to inherit, inheriting a single value for a shorthand property
The 'border-top' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-top-017
-
Border-top set to inherit, inheriting two values for a shorthand property
The 'border-top' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-top-018
-
Border-top set to inherit, inheriting three values for a shorthand property
The 'border-top' shorthand property properly accepts 'inherit' as a value and uses its parent's border setting. - border-top-applies-to-001
-
Border-top applied to element with display table-row-group
The 'border-top' property applies to elements with a display of table-row-group. - border-top-applies-to-002
-
Border-top applied to element with display table-header-group
The 'border-top' property applies to elements with a display of table-header-group. - border-top-applies-to-003
-
Border-top applied to element with display table-footer-group
The 'border-top' property applies to elements with a display of table-footer-group. - border-top-applies-to-004
-
Border-top applied to element with display table-row
The 'border-top' property applies to elements with a display of table-row. - border-top-applies-to-005
-
Border-top applied to element with display table-column-group
The 'border-top' property applies to elements with a display of table-column-group. - border-top-applies-to-006
-
Border-top applied to element with display table-column
The 'border-top' property applies to elements with a display of table-column. - border-top-applies-to-007
-
Border-top applied to element with display table-cell
The 'border-top' property applies to elements with a display of table-cell. - border-top-applies-to-008
-
Border-top applied to element with display inline
The 'border-top' property applies to elements with a display of inline. - border-top-applies-to-009
-
Border-top applied to element with display block
The 'border-top' property applies to elements with a display of block. - border-top-applies-to-010
-
Border-top applied to element with display list-item
The 'border-top' property applies to elements with a display of list-item. - border-top-applies-to-012
-
Border-top applied to element with display inline-block
The 'border-top' property applies to elements with a display of inline-block. - border-top-applies-to-013
-
Border-top applied to element with display table
The 'border-top' property applies to elements with a display of table. - border-top-applies-to-014
-
Border-top applied to element with display inline-table
The 'border-top' property applies to elements with a display of inline-table. - border-top-applies-to-015
-
Border-top applied to element with display table-caption
The 'border-top' property applies to elements with a display of table-caption.