|
+
3.1 box-sizing property |
|---|
|
box-sizing-border-box-001 |
|
|
Box Sizing - Border-Box with specified width
- box-sizing: border-box should make the element's (percentage) width be the distance from the left border edge to the right border edge.
|
|
box-sizing-border-box-002 |
|
|
Box Sizing - Border-Box with specified width
- box-sizing: border-box should make the element's (percentage) width be the distance from the left border edge to the right border edge.
|
|
box-sizing-border-box-003 |
|
|
Box Sizing - Border-Box with specified width/height
- box-sizing: border-box should make the element's (percentage) width be the distance from the left border edge to the right border edge and the height be the distance from the top border edge to the bottom border edge.
|
|
box-sizing-border-box-004 |
|
|
Box Sizing - Border-Box with min/max width/height
- box-sizing: border-box should make the element's (length) width be the distance from the left border edge to the right border edge and the height be the distance from the top border edge to the bottom border edge.
|
|
box-sizing-content-box-001 |
|
|
Box Sizing - Content-Box with specified width/height
- box-sizing: content-box should make the element's (percentage) width be the distance from the left content edge to the right content edge and the height be the distance from the top content edge to the bottom content edge.
|
|
box-sizing-content-box-002 |
|
|
Box Sizing - Content-Box with specified width/height
- box-sizing: content-box should make the element's (calc) width be the distance from the left content edge to the right content edge and the height be the distance from the top content edge to the bottom content edge.
|
|
box-sizing-content-box-003 |
|
|
Box Sizing - Content-Box with min/max width/height
- box-sizing: content-box should make the element's (percentage) width be the distance from the left content edge to the right content edge and the height be the distance from the top content edge to the bottom content edge.
|
|
box-sizing-padding-box-001 |
|
|
Box Sizing - Padding-Box with specified width/height
- box-sizing: padding-box should make the element's (percentage) width be the distance from the left padding edge to the right padding edge.
|
|
box-sizing-padding-box-002 |
|
|
Box Sizing - Padding-Box with specified width/height
- box-sizing: padding-box should make the element's (percentage) width be the distance from the left padding edge to the right padding edge and the height be the distance from the top padding edge to the bottom padding edge.
|
|
box-sizing-padding-box-003 |
|
|
Box Sizing - Padding-Box with min/max width/height
- box-sizing: padding-box should make the element's (calc) width be the distance from the left padding edge to the right padding edge and the height be the distance from the top padding edge to the bottom padding edge.
|
|
box-sizing-replaced-001 |
|
Bitmaps |
Min/Max Height and Width Constraints on Replaced Elements with Box-Sizing
- All images should be sized at 75px x 75px, with 5px of padding around each.
|
|
box-sizing-replaced-002 |
|
Bitmaps |
Min/Max Height and Width Constraints on Replaced Elements with Box-Sizing
- All images should be sized at 75px x 75px, with 5px of padding and 5px of blue border around each.
|
|
box-sizing-replaced-003 |
|
Bitmaps |
Min/Max Height and Width Constraints on Replaced Elements with Box-Sizing
- All images should be sized at 75px x 75px.
|