|
autoheight-regions-in-autoheight-flexbox-004 |
= |
Ahem |
CSS Regions: nested regions in flexbox
- Test checks that nested regions placed in flex containers are laid out properly. The first flow (blue content) is nested inside the second flow (green content). The user should see three horizontal stripes with the following colors: green, blue, green.
|
|
flex-direction |
= |
|
flex flow direction
- The flow of flex items in the the flex container should observe the flex-direction property.
|
|
flex-direction-column-reverse |
|
|
flex-direction: column-reverse swaps main start and end directions
- This test checks that column-reverse flex-direction swaps the main start and main end directions
|
|
flex-direction-modify |
= |
|
flex flow direction
- Changing 'flex-direction' with JavaScript and then changing it back should returns to the original look.
|
|
flex-direction-row |
|
|
flex-direction:row axis matches that of writing mode inline axis
- This test checks that the main axis of the row flex-direction has the same orientation as the inline axis of the current writing mode
|
|
flex-direction-row-reverse |
|
|
flow-direction:row-reverse swaps main start and end directions
- This test checks that row-reverse flex-direction swaps the main start and main end directions
|
|
flex-direction-row-vertical |
|
|
flex-direction:row has the same orientation as inline axis
- This test checks that the main axis of the row flex-direction has the same orientation as the inline axis of the current vertical writing mode
|
|
flex-direction-with-element-insert |
= |
|
flex flow direction
- The flex items inserted by script shuould follow the right direction what the flex-direction property directives.
|
|
flex-flow-001 |
= |
|
flex-flow - row nowrap
- The 'flex-flow' property set 'row nowrap' controls the flex container is single-line
|
|
flex-flow-002 |
= |
|
flex-flow - row wrap
- The 'flex-flow' property set 'row wrap' controls the flex container is multi-line
|
|
flex-flow-003 |
= |
|
flex-flow - row wrap-reverse
- The 'flex-flow' property set 'row wrap-reverse' controls the flex container is multi-line but the cross-start and cross-end directions are swapped
|
|
flex-flow-004 |
= |
|
flex-flow - row-reverse nowrap
- The 'flex-flow' property set 'row-reverse nowrap' controls the flex container is single-line, but the main-start and main-end directions are swapped
|
|
flex-flow-005 |
= |
|
flex-flow - row-reverse wrap
- The 'flex-flow' property set 'row-reverse wrap' controls the flex container is multi-line but the main-start and main-end directions are swapped
|
|
flex-flow-006 |
= |
|
flex-flow - row-reverse wrap-reverse
- The 'flex-flow' property set 'row-reverse wrap-reverse' controls the flex container is multi-line but the main-start and main-end, cross-start and cross-end directions are all swapped
|
|
flex-flow-007 |
= |
|
flex-flow - column nowrap
- The 'flex-flow' property set 'column nowrap' controls the flex container is single-line, but the main axis is vertical
|
|
flex-flow-008 |
= |
|
flex-flow - column wrap
- The 'flex-flow' property set 'column wrap' controls the flex container is multi-line but the main axis is vertical
|
|
flex-flow-009 |
= |
|
flex-flow - column wrap-reverse
- The 'flex-flow' property set 'column wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the cross-start and cross-end directions are swapped
|
|
flex-flow-010 |
= |
|
flex-flow - column-reverse nowrap
- The 'flex-flow' property set 'column-reverse nowrap' controls the flex container is single-line, but the main axis is vertical, the main-start and main-end directions are swapped
|
|
flex-flow-011 |
= |
|
flex-flow - column-reverse wrap
- The 'flex-flow' property set 'column-reverse wrap' controls the flex container is multi-line but the main axis is vertical, the main-start and main-end directions are swapped
|
|
flex-flow-012 |
= |
|
flex-flow - column-reverse wrap-reverse
- The 'flex-flow' property set 'column-reverse wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the 'cross-start/cross-end' and 'main-start/main-end' directions are all swapped
|
|
flexbox_computedstyle_flex-direction-column |
|
DOM/JS |
flexbox | computed style | flex-direction: column
|
|
flexbox_computedstyle_flex-direction-column-reverse |
|
DOM/JS |
flexbox | computed style | flex-direction: column-reverse
|
|
flexbox_computedstyle_flex-direction-invalid |
|
DOM/JS |
flexbox | computed style | flex-direction: row
|
|
flexbox_computedstyle_flex-direction-row |
|
DOM/JS |
flexbox | computed style | flex-direction: row
|
|
flexbox_computedstyle_flex-direction-row-reverse |
|
DOM/JS |
flexbox | computed style | flex-direction: row-reverse
|
|
flexbox_rtl-direction |
= |
|
flexbox | flex-direction: column-reverse | rtl
|