|
+
3.1 Block Flow Direction: the writing-mode property |
|---|
|
block-flow-direction-001 |
= |
Ahem |
horizontal-tb - block flow direction of block-level boxes
- This test checks that block-level boxes in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of a containing block; they are ordered from top to bottom meaning that the 1st block box is the topmost one, then the 2nd block is juxtaposed at its bottom, then the 3rd block is juxtaposed to the 2nd block at its bottom, etc...
|
|
block-flow-direction-002 |
= |
Ahem |
vertical-rl - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...
|
|
block-flow-direction-003 |
= |
Ahem |
vertical-lr - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...
|
|
block-flow-direction-004 |
= |
Ahem |
'writing-mode' - initial value is 'horizontal-tb'
- This test checks that the default, initial value of writing-mode is 'horizontal-tb'.
|
|
block-flow-direction-005 |
= |
Ahem |
'float: left' and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that a left-floated box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-006 |
= |
Ahem |
'float: left' and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that left-floated boxes with 'writing-mode' set to 'vertical-rl' establish block formating contexts with a right-to-left block flow direction.
|
|
block-flow-direction-007 |
= |
Ahem |
'float: right' and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that a right-floated box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-008 |
= |
Ahem |
'float: right' and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that right-floated boxes with 'writing-mode' set to 'vertical-lr' establish block formating contexts with a left-to-right block flow direction.
|
|
block-flow-direction-009 |
= |
Ahem |
position absolute and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-010 |
= |
Ahem |
position absolute and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-011 |
= |
Ahem |
inline-block and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-012 |
= |
Ahem |
inline-block and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-013 |
= |
Ahem |
inline-block and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-014 |
= |
Ahem |
inline-block and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-015 |
= |
Ahem |
inline-block and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-016 |
= |
Ahem |
inline-block and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that an inline-block with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-017 |
= |
Ahem |
table-cell and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that a table-cell with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-018 |
= |
Ahem |
table-cell and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that a table-cell with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-019 |
= |
Ahem |
table-caption and 'vertical-rl' - block flow direction of block-level boxes
- This test checks that a table-caption with its 'writing-mode' set to 'vertical-rl' establishes a block formating context with a right-to-left block flow direction.
|
|
block-flow-direction-020 |
= |
Ahem |
table-caption and 'vertical-lr' - block flow direction of block-level boxes
- This test checks that a table-caption with its 'writing-mode' set to 'vertical-lr' establishes a block formating context with a left-to-right block flow direction.
|
|
block-flow-direction-021 |
= |
AhemBitmaps |
list and vertical-rl - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one and then the 2nd block is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...
|
|
block-flow-direction-022 |
= |
AhemBitmaps |
list and vertical-lr - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and then the 2nd block is juxtaposed to the right-hand side of 1st block, the 3rd block is juxtaposed to the 2nd block on its right-hand side, etc...
|
|
block-flow-direction-023 |
= |
Ahem |
vertical-lr - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of its containing block; they are ordered from left to right meaning that the 1st block box is the leftmost one and, then the 2nd block is juxtaposed at the right-hand side of 1st block, then the 3rd block is juxtaposed at the 2nd block on its right-hand side, etc...
|
|
block-flow-direction-024 |
= |
Ahem |
vertical-rl - block flow direction of block-level boxes
- This test checks that block-level boxes in a block formating context with 'writing-mode' set to 'vertical-rl' are laid out one after the other with the first beginning at the right-hand side of its containing block; they are ordered from right to left meaning that the 1st block box is the rightmost one, then the 2nd block is juxtaposed at its left-hand side, then the 3rd block is juxtaposed at the 2nd block on its left-hand side, etc...
|
|
block-flow-direction-025 |
= |
Bitmaps |
writing mode of document - horizontal position of first block
- This test checks that, when 'writing-mode' value of the root element is set to 'vertical-rl', then its block boxes are laid out leftwardedly (from right to left) one after the other beginning at its righthand side.
|
|
different-block-flow-dir-001 |
= |
|
descendant inline with a different 'writing-mode' value
- This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.
|
|
different-block-flow-dir-002 |
= |
|
descendant inline with a different 'writing-mode' value
- This test checks that if an inline box has a different block flow direction than its containing block then its display computes to 'inline-block' in which case its specified width and specified height are not ignored and have to be rendered.
|
|
form-controls-vert-rl-004 |
|
BitmapsRecommend |
order, orientation and layout of form controls in 'vertical-rl' writing-mode
- This test checks the order, the flow, the orientation and layout of form controls used in Example 4 of section 3.1.
|
|
form-controls-vert-rl-005 |
|
Recommend |
form controls in 'vertical-rl' writing-mode
- This test checks the rendering of various form controls (select, optgroup, options, various types of input and buttons) written with latin text in 'vertical-rl' writing mode. The text of replaced content should match the replaced element's writing mode and line orientation; therefore, in this test, a) the text's inline base direction must be from top to bottom, b) the glyphs must be rotated 90° clockwise and c) the block flow direction must be from right to left.
|
|
inline-replaced-vlr-003 |
= |
Bitmaps |
inline replaced element and 'vertical-lr'
- This test checks that the content of an inline replaced element does not rotate due to the writing mode.
|
|
inline-replaced-vrl-002 |
= |
Bitmaps |
inline replaced element and 'vertical-rl'
- This test checks that the content of an inline replaced element does not rotate due to the writing mode.
|
|
line-box-direction-001 |
= |
Ahem |
horizontal-tb - ordering direction of line boxes
- This test checks that line boxes of a block box in a 'horizontal-tb' writing mode are laid out one after the other, vertically, with the first beginning at the top of the block box; they are ordered from top to bottom meaning that the 1st line box is the topmost one and then the 2nd block is juxtaposed to its bottom, the 3rd block is juxtaposed to the 2nd block on its left-hand side, etc...
|
|
line-box-direction-002 |
= |
Ahem |
vertical-rl - ordering direction of line boxes
- This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...
|
|
line-box-direction-003 |
= |
Ahem |
vertical-lr - ordering direction of line boxes
- This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...
|
|
line-box-direction-005 |
= |
Ahem |
'float: left' and 'vertical-rl' - ordering direction of line boxes
- This test checks that the line boxes of a left-floated box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.
|
|
line-box-direction-006 |
= |
Ahem |
'float: left' and 'vertical-rl' - ordering direction of line boxes
- This test checks that the line boxes of left-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from right to left.
|
|
line-box-direction-007 |
= |
Ahem |
'float: right' and 'vertical-lr' - ordering direction of line boxes
- This test checks that the line boxes of a right-floated box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.
|
|
line-box-direction-008 |
= |
Ahem |
'float: right' and 'vertical-lr' - ordering direction of line boxes
- This test checks that the line boxes of right-floated boxes with 'writing-mode' set to 'vertical-lr' will be ordered from left to right.
|
|
line-box-direction-009 |
= |
Ahem |
position absolute and 'vertical-rl' - ordering direction of line boxes
- This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-rl' will be ordered from right to left.
|
|
line-box-direction-010 |
= |
Ahem |
position absolute and 'vertical-lr' - ordering direction of line boxes
- This test checks that line boxes of an absolutely positioned box with its 'writing-mode' set to 'vertical-lr' will be ordered from left to right.
|
|
line-box-direction-011 |
= |
Ahem |
inline-block and 'vertical-rl' - ordering direction of line boxes
- This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.
|
|
line-box-direction-012 |
= |
Ahem |
inline-block and 'vertical-rl' - ordering direction of line boxes
- This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-rl' are ordered from right to left.
|
|
line-box-direction-013 |
= |
Ahem |
inline-block and 'vertical-lr' - ordering direction of line boxes
- This test checks that lines boxes of descendant block boxes of an inline-block with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.
|
|
line-box-direction-014 |
= |
Ahem |
inline-block and 'vertical-lr' - ordering direction of line boxes
- This test checks that lines boxes of descendant block boxes of inline-blocks with 'writing-mode' set to 'vertical-lr' are ordered from left to right.
|
|
line-box-direction-015 |
= |
Ahem |
table-cell and 'vertical-rl' - ordering direction of line boxes
- This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.
|
|
line-box-direction-016 |
= |
Ahem |
table-cell and 'vertical-lr' - ordering direction of line boxes
- This test checks that the lines boxes of a table-cell with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.
|
|
line-box-direction-017 |
= |
Ahem |
table-caption and 'vertical-rl' - ordering direction of line boxes
- This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-rl' are ordered from right to left.
|
|
line-box-direction-018 |
= |
Ahem |
table-caption and 'vertical-lr' - ordering direction of line boxes
- This test checks that the lines boxes of a table-caption with its 'writing-mode' set to 'vertical-lr' are ordered from left to right.
|
|
line-box-direction-019 |
= |
Ahem |
list and 'vertical-rl' - ordering direction of line boxes
- This test checks that line boxes of a block box in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost line of the block box; they are ordered from right to left meaning that the 1st line box is the rightmost one and then the 2nd line box is juxtaposed to its left-hand side, the 3rd block is juxtaposed to the 2nd line box on its left-hand side, etc...
|
|
line-box-direction-020 |
= |
Ahem |
list and 'vertical-lr' - ordering direction of line boxes
- This test checks that line boxes in a block box with 'writing-mode' set to 'vertical-lr' are laid out one after the other with the first beginning at the left-hand side of the block box; they are ordered from left to right meaning that the 1st line box is the leftmost one and then the 2nd line box is juxtaposed to the right-hand side of 1st line box, the 3rd line box is juxtaposed to the 2nd line box on its right-hand side, etc...
|
|
list-items-vert-rl-005 |
|
Bitmaps |
order, orientation and layout of list items in a 'vertical-rl' writing-mode
- This test checks the order, the orientation and layout of list items when in a 'vertical-rl' writing mode as illustrated by and according to Example 5 of section 3.1.
|
|
page-flow-direction-002 |
|
BitmapsPaged |
'writing-mode: vertical-rl' - default page flow (progression) direction
- This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is right-to-left.
|
|
page-flow-direction-003 |
|
BitmapsPaged |
'writing-mode: vertical-lr' - default page flow (progression) direction
- This test checks that when 'writing-mode' is set on the root element, then it determines the default page flow (or progression) direction. In this test, the page flow (or progression) direction is left-to-right.
|
|
replaced-content-image-002 |
|
Recommend |
alternate text of image and vertical writing mode
- This test checks that alternate text (latin) of image rotates 90° clockwise in vertical writing mode.
|
|
replaced-content-image-003 |
|
Recommend |
alternate text of image and vertical writing mode
- This test checks that alternate text (latin) of image rotates 90° clockwise in vertical writing mode.
|
|
row-progression-002 |
= |
Ahem |
vertical-rl - table rows progression
- This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...
|
|
row-progression-003 |
= |
Ahem |
vertical-lr - table rows progression
- This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc...
|
|
row-progression-004 |
= |
Ahem |
vertical-rl - table rows progression and colspan
- This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.
|
|
row-progression-005 |
= |
Ahem |
vertical-lr - table rows progression and colspan
- This test checks that colspanned cells in a table are handled according to a top-to-bottom inline flow direction.
|
|
row-progression-006 |
= |
Ahem |
vertical-rl - table rows progression and rowspan
- This test checks that rowspanned cells in a table are handled according to a right-to-left direction.
|
|
row-progression-007 |
= |
Ahem |
vertical-lr - table rows progression and rowspan
- This test checks that rowspanned cells in a table are handled according to a left-to-right direction.
|
|
row-progression-008 |
= |
Ahem |
vertical-rl - table rows progression (thead, 2 tbodies, tfoot)
- This test checks that rows of a table element with in a 'vertical-rl' writing mode are laid out one after the other, leftwardedly, with the first beginning at the rightmost side of the table box; table rows are ordered from right to left meaning that the 1st row is the rightmost one and then the 2nd row is juxtaposed to its left-hand side, the 3rd row is juxtaposed to the 2nd row on its left-hand side, etc...
|
|
row-progression-009 |
= |
Ahem |
vertical-lr - table rows progression (thead, 2 tbodies, tfoot)
- This test checks that rows of a table element with in a 'vertical-lr' writing mode are laid out one after the other, rightwardedly, with the first beginning at the leftmost side of the table box; table rows are ordered from left to right meaning that the 1st row is the leftmost one and then the 2nd row is juxtaposed to its right-hand side, the 3rd row is juxtaposed to the 2nd row on its right-hand side, etc...
|
|
writing-mode-stretch-001 |
= |
|
writing-mode vertical-lr and vertical-rl
- vertical-writing-mode flex items should stretch
|
|
writing-mode-vertical-rl-003 |
= |
Ahem |
writing-mode: horizontal-tb nested in vertical-rl
- when child block has its own writing-mode, child block's writing-mode overwrites parent block's writing-mode.
|