To run the test, or to see detailed, per character, results, click on the link in the left-most column. To see detailed results click on a row and look just above the table.
Key: | pass | fail | partially successful |
---|
Updated
These tests check whether user agents correctly apply the property values defined in the CSS-logical-values spec. These are simple, user-oriented tests, designed to check basic functionality, rather than test all edge cases and implementation details.
Where the instructions tell you to look for red, the red should be clearly discernable behind the rest of the test – ignore any anti-aliasing 'glow'.
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
block size block-size-001.html |
The block-size property will set the size in the block progression dimension for horizontal text. | pass | pass | pass |
inline size inline-size-001.html |
The inline-size property will set the size in the inline progression dimension for horizontal text. | pass | pass | pass |
inline size rtl-inline-size-001.html |
The inline-size property will set the size in the inline progression dimension for horizontal text. | pass | pass | pass |
block size (vlr) vlr-block-size-001.html |
The block-size property will set the size in the block progression dimension for vertical-lr text. | pass | pass | pass |
block size (vrl) vrl-block-size-001.html |
The block-size property will set the size in the block progression dimension for vertical-rl text. | pass | pass | pass |
inline size (vlr) vlr-inline-size-001.html |
The inline-size property will set the size in the inline progression dimension for vertical lr text. | pass | pass | pass |
inline size (vrl) vrl-inline-size-001.html |
The inline-size property will set the size in the inline progression dimension for vertical rl text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
margin-block-start margin-block-start-001.html |
The margin-block-end property produces a margin above horizontal text. | pass | pass | pass |
margin-block-end margin-block-end-001.html |
The margin-block-end property produces a margin below horizontal text. | pass | pass | pass |
margin-inline-start (ltr) ltr-margin-inline-start-001.html |
The margin-inline-start property produces a margin to the left of horizontal text. | pass | pass | pass |
margin-inline-end (ltr) ltr-margin-inline-end-001.html |
The margin-inline-end property produces a margin to the right of horizontal text. | pass | pass | pass |
margin-inline-start (rtl) rtl-margin-inline-start-001.html |
The margin-inline-start property produces a margin to the right of RTL horizontal text. | pass | pass | pass |
margin-inline-end (rtl) rtl-margin-inline-end-001.html |
The margin-inline-end property produces a margin to the left of RTL horizontal text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
margin-block-start (vrl) vrl-margin-block-start-001.html |
The margin-block-start property produces a margin to the right of vertical text with lines ordered from right to left. | pass | pass | pass |
margin-block-end (vrl) vrl-margin-block-end-001.html |
The margin-block-end property produces a margin to the left of vertical text with lines ordered from right to left. | pass | pass | pass |
margin-inline-start (vrl) vrl-margin-inline-start-001.html |
The margin-inline-start property produces a margin above a line of vertical text. | pass | pass | pass |
margin-inline-end (vrl) vrl-margin-inline-end-001.html |
The margin-inline-end property produces a margin above a line of vertical text. | pass | pass | pass |
margin-block-start (vlr) vlr-margin-block-start-001.html |
The margin-block-start property produces a margin to the right of vertical text with lines ordered from left to right. | pass | pass | pass |
margin-block-end (vlr) vlr-margin-block-end-001.html |
The margin-block-end property produces a margin to the left of vertical text with lines ordered from left to right. | pass | pass | pass |
margin-inline-start (vlr) vlr-margin-inline-start-001.html |
The margin-inline-start property produces a margin above a line of vertical text. | pass | pass | pass |
margin-inline-end (vlr) vlr-margin-inline-end-001.html |
The margin-inline-end property produces a margin below a line of vertical text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
margin-block (1 value) margin-block-001.html |
The margin-block property with a single value produces a margin above and below horizontal text. | pass | pass | pass |
margin-block (2 values) margin-block-002.html |
The margin-block property with 2 values produces a margin above and below horizontal text. | pass | pass | pass |
margin-inline (1 value) margin-inline-001.html |
The margin-inline property with a single value produces a margin to the left and right of horizontal text. | pass | pass | pass |
margin-inline (2 values) margin-inline-002.html |
The margin-inline property with 2 values produces a margin to the left and right of horizontal text. | pass | pass | pass |
margin logical (4 values) margin-001.html |
[Exploratory] The margin property with a 'logical' flag and 4 values produces a margin all around horizontal text, with the correct dimensions. | fail | fail | fail |
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
padding-block-start padding-block-start-001.html |
The padding-block-start property produces padding above horizontal text. | pass | pass | pass |
padding-block-end padding-block-end-001.html |
The padding-block-end property produces padding below horizontal text. | pass | pass | pass |
padding-inline-start padding-inline-start-001.html |
The padding-inline-start property produces padding to the left of horizontal text. | pass | pass | pass |
padding-inline-end padding-inline-end-001.html |
The padding-inline-end property produces padding to the right of horizontal text. | pass | pass | pass |
padding-inline-start (rtl) rtl-padding-inline-start-001.html |
The padding-inline-start property produces padding to the right of RTL horizontal text. | pass | pass | pass |
padding-inline-end (rtl) rtl-padding-inline-end-001.html |
The padding-inline-end property produces padding to the left of RTL horizontal text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
padding-block-start (vrl) vrl-padding-block-start-001.html |
The padding-block-start property produces padding to the right of vertical text with lines ordered from right to left. | pass | pass | pass |
padding-block-end (vrl) vrl-padding-block-end-001.html |
The padding-block-end property produces padding to the left of vertical text with lines ordered from right to left. | pass | pass | pass |
padding-inline-start (vrl) vrl-padding-inline-start-001.html |
The padding-inline-start property produces a padding above a line of vertical text. | pass | pass | pass |
padding-inline-end (vrl) vrl-padding-inline-end-001.html |
The padding-inline-end property produces padding below a line of vertical text. | pass | pass | pass |
padding-block-start (vlr) vlr-padding-block-start-001.html |
The padding-block-start property produces padding to the left of vertical text with lines ordered from left to right. | pass | pass | pass |
padding-block-end (vlr) vlr-padding-block-end-001.html |
The padding-block-end property produces padding to the right of vertical text with lines ordered from left to right. | pass | pass | pass |
padding-inline-start (vlr) vlr-padding-inline-start-001.html |
The padding-inline-start property produces a padding above a line of vertical LR text. | pass | pass | pass |
padding-inline-end (vlr) vlr-padding-inline-end-001.html |
The padding-inline-end property produces padding below a line of vertical LR text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
padding-block (1 value) padding-block-001.html |
The padding-block property produces padding above & below horizontal text. | pass | pass | pass |
padding-block (2 values) padding-block-002.html |
The padding-block property can produce padding above & below horizontal text by different amounts. | pass | pass | pass |
padding logical (4 values) padding-001.html |
[Exploratory] The padding-block property with the logical keyword and 4 different values produces padding around a block of the with the correct dimensions. | fail | fail | fail |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-block-start-width border-block-start-width-001.html |
The border-block-start-width property affects the border above horizontal text. | pass | pass | pass |
border-block-end-width border-block-end-width-001.html |
The border-block-end-width property affects the border below horizontal text. | pass | pass | pass |
border-inline-start-width border-inline-start-width-001.html |
The border-inline-start-width property affects the border to the left of horizontal text. | pass | pass | pass |
border-inline-end-width border-inline-end-width-001.html |
The border-inline-end-width property affects the border to the right of horizontal text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-block-start-width vlr-border-block-start-width-001.html |
The border-block-start-width property affects the border to the left in vertical text when lines run left to right. | pass | pass | pass |
border-block-end-width vlr-border-block-end-width-001.html |
The border-block-end-width property affects the border to the right in vertical text where lines run left to right. | pass | pass | pass |
border-inline-start-width vlr-border-inline-start-width-001.html |
The border-inline-start-width property affects the border above vertical text where lines are stacked left to right. | pass | pass | pass |
border-inline-end-width vlr-border-inline-end-width-001.html |
The border-inline-end-width property affects the border below vertical text where lines run left to right. | pass | pass | pass |
border-block-start-width vrl-border-block-start-width-001.html |
The border-block-start-width property affects the border to the right in vertical text. | pass | pass | pass |
border-block-end-width vrl-border-block-end-width-001.html |
The border-block-end-width property affects the border to the left in vertical text. | pass | pass | pass |
border-inline-start-width vrl-border-inline-start-width-001.html |
The border-inline-start-width property affects the border above vertical text. | pass | pass | pass |
border-inline-end-width vrl-border-inline-end-width-001.html |
The border-inline-end-width property affects the border below vertical text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-block-width border-block-width-001.html |
The border-block-width property affects the border above and below horizontal text. | pass | pass | pass |
border-inline-width border-inline-width-001.html |
The border-inline-width property affects the border to the left and right of horizontal text. | pass | pass | pass |
border-width border-width-001.html |
[Exploratory] The border-width property affects the borders all around horizontal text when the 'logical' flag is used, and sets appropriate thicknesses. | fail | fail | fail |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-block-start-style border-block-start-style-001.html |
The border-block-start-style property affects the border above horizontal text. | pass | pass | pass |
border-block-end-style border-block-end-style-001.html |
The border-block-end-style property affects the border below horizontal text. | pass | pass | pass |
border-inline-start-style border-inline-start-style-001.html |
The border-inline-start-style property affects the border to the left of horizontal text. | pass | pass | pass |
border-inline-end-style border-inline-end-style-001.html |
The border-inline-end-style property affects the border to the right of horizontal text. | pass | pass | pass |
border-block-start-style vrl-border-block-start-style-001.html |
The border-block-start-style property affects the border to the right in vertical text. | pass | pass | pass |
border-block-end-style vrl-border-block-end-style-001.html |
The border-block-end-style property affects the border to the left in vertical text. | pass | pass | pass |
border-inline-start-style vrl-border-inline-start-style-001.html |
The border-inline-start-style property affects the border above vertical text. | pass | pass | pass |
border-inline-end-style vrl-border-inline-end-style-001.html |
The border-inline-end-style property affects the border below vertical text. | pass | pass | pass |
border-block-start-style (vlr) vlr-border-block-start-style-001.html |
The border-block-start-style property affects the border to the right in vertical text where lines stack left to right. | pass | fail | pass |
border-block-end-style (vlr) vlr-border-block-end-style-001.html |
The border-block-end-style property affects the border to the left in vertical text where lines stack left to right. | pass | fail | pass |
border-inline-start-style (vlr) vlr-border-inline-start-style-001.html |
The border-inline-start-style property affects the border above vertical text where lines stack left to right. | pass | pass | pass |
border-inline-end-style (vlr) vlr-border-inline-end-style-001.html |
The border-inline-end-style property affects the border below vertical text where lines stack left to right. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-block-start-color border-block-start-color-001.html |
The border-block-start-color property affects the border above horizontal text. | pass | pass | pass |
border-block-end-color border-block-end-color-001.html |
The border-block-end-color property affects the border below horizontal text. | pass | pass | pass |
border-inline-start-color border-inline-start-color-001.html |
The border-inline-start-color property affects the border to the left of horizontal text. | pass | pass | pass |
border-inline-end-color border-inline-end-color-001.html |
The border-inline-end-color property affects the border to the right of horizontal text. | pass | pass | pass |
border-block-start-color vrl-border-block-start-color-001.html |
The border-block-start-color property affects the border to the right in vertical text. | pass | pass | pass |
border-block-end-color vrl-border-block-end-color-001.html |
The border-block-end-color property affects the border to the left in vertical text. | pass | pass | pass |
border-inline-start-color vrl-border-inline-start-color-001.html |
The border-inline-start-color property affects the border above vertical text. | pass | pass | pass |
border-inline-end-color vrl-border-inline-end-color-001.html |
The border-inline-end-color property affects the border below vertical text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
border-start-start-radius border-start-start-radius-001.html |
The border-start-start-radius property affects the top left corner of the border around horizontal text. | pass | pass | pass |
border-start-end-radius border-start-end-radius-001.html |
The border-start-end-radius property affects the top right corner of the border around horizontal text. | pass | pass | pass |
border-end-start-radius border-end-start-radius-001.html |
The border-end-start-radius property affects the bottom left corner of the border around horizontal text. | pass | pass | pass |
border-end-end-radius border-end-end-radius-001.html |
The border-end-end-radius property affects the bottom right corner of the border around horizontal text. | pass | pass | pass |
border-start-start-radius (vrl) vrl-border-start-start-radius-001.html |
The border-start-start-radius property affects the top right corner of the border around vertical RL text. | pass | pass | pass |
border-start-end-radius (vrl) vrl-border-start-end-radius-001.html |
The border-start-end-radius property affects the bottom right corner of the border around vertical RL text. | pass | pass | pass |
border-end-start-radius (vrl) vrl-border-end-start-radius-001.html |
The border-end-start-radius property affects the top left corner of the border around vertical RL text. | pass | pass | pass |
border-end-end-radius (vrl) vrl-border-end-end-radius-001.html |
The border-end-end-radius property affects the bottom left corner of the border around vertical RL text. | pass | pass | pass |
border-start-start-radius (vlr) vlr-border-start-start-radius-001.html |
The border-start-start-radius property affects the top left corner of the border around vertical LR text. | pass | pass | pass |
border-start-end-radius (vlr) vlr-border-start-end-radius-001.html |
The border-start-end-radius property affects the bottom left corner of the border around vertical LR text. | pass | pass | pass |
border-end-start-radius (vlr) vlr-border-end-start-radius-001.html |
The border-end-start-radius property affects the top right corner of the border around vertical LR text. | pass | pass | pass |
border-end-end-radius (vlr) vlr-border-end-end-radius-001.html |
The border-end-end-radius property affects the bottom right corner of the border around vertical LR text. | pass | pass | pass |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
block-start caption-side-block-start-000.html |
caption-side:block-start will cause captions to appear above the table in horizontal text. | pass | pass | pass |
block-start (vrl) caption-side-block-start-001.html |
caption-side:block-start will cause captions to appear to the right in RL vertical text. | pass | pass | pass |
block-start (vlr) caption-side-block-start-002.html |
caption-side:block-start will cause captions to appear to the right in LR vertical text. | pass | pass | pass |
block-end caption-side-block-end-000.html |
caption-side:block-end will cause captions to appear below the table in horizontal text. | fail | fail | fail |
block-end (vrl) caption-side-block-end-001.html |
caption-side:block-end will cause captions to appear to the left in RL vertical text. | fail | fail | fail |
block-end (vlr) caption-side-block-end-002.html |
caption-side:block-end will cause captions to appear to the right in LR vertical text. | fail | fail | fail |
inline-start caption-side-inline-start-001.html |
caption-side:inline-start will cause captions to appear to the left in horizontal LTR text. | fail | fail | fail |
inline-start (rtl) caption-side-inline-start-002.html |
caption-side:inline-start will cause captions to appear to the right in horizontal RTL text. | fail | fail | fail |
inline-end caption-side-inline-end-001.html |
caption-side:inline-end will cause captions to appear to the right in horizontal LTR text. | fail | fail | fail |
inline-end caption-side-inline-end-002.html |
caption-side:inline-end will cause captions to appear to the left in horizontal RTL text. | fail | fail | fail |
Spec links for this table: link
Links to run tests | Assertions | Gecko Firefox | Blink Chrome | Webkit Safari |
---|---|---|---|---|
inline-start float-inline-start-001.html |
float:inline-start will cause captions to appear to the left in LTR horizontal text. | pass | fail | pass |
inline-start float-inline-start-002.html |
float:inline-start will float text to the right in RTL horizontal text. | pass | fail | pass |
inline-end float-inline-end-001.html |
float:inline-end will cause captions to appear to the right in LTR horizontal text. | pass | fail | pass |
inline-end float-inline-end-002.html |
float:inline-end will cause captions to appear to the left in RTL horizontal text. | pass | fail | pass |
Spec links for this table: link