CSS 2.1 Conformance Test Suite

Visual formatting model (47 tests)

Test Refs Flags Info
+ 9 Visual formatting model
+ 9.1 Introduction to the visual formatting model
+ 9.1.1 The viewport
+ 9.1.2 Containing blocks
+ 9.2 Controlling box generation
+ 9.2.1 Block-level elements and block boxes
+ 9.2.1.1 Anonymous block boxes
+ 9.2.2 Inline-level elements and inline boxes
+ 9.2.2.1 Anonymous inline boxes
anonymous-inline-inherit-001 =
+ 9.2.3 Run-in boxes
+ 9.2.4 The 'display' property
display-computed Script CSS Display: getComputedStyle().display
  • position and float can change display computed value.
  • display computed value is otherwise as specified.
display-interpolation Script display interpolation
  • display supports animation
display-invalid Script CSS Display: parsing display with invalid values
  • display supports only the spec grammar.
display-valid Script CSS Display: parsing display with valid values
  • display supports the full spec grammar.
  • display supports the new values 'grid | inline-grid'.
toggle-row-display-property-001 =
  • After setting display:table-row on tr elements with display:none, the table should look same as if display:none were never used.
+ 9.3 Positioning schemes
+ 9.3.1 Choosing a positioning scheme: 'position' property
abspos-inline-container-in-inline-block Script
line-break-after-leading-oof-001 Line wrapping after leading out-of-flow objects
+ 9.3.2 Box offsets: 'top', 'right', 'bottom', 'left'
left-offset-position-fixed-001 = left:auto offset of position:fixed box in a position:relative containing block
  • The 'left' box offset property, for fixed positioning, when set to 'auto' specifies the offset of the box from its 'static-position containing block'. Here, in this test, the 'static-position containing block' is #shifted-column and the containing block for #red is established by the viewport.
right-offset-position-fixed-001 = right:auto offset of position:fixed box in an RTL position:relative containing block
  • The 'right' box offset property, for fixed positioning, when set to 'auto' specifies the offset of the box from its 'static-position containing block'. Here, in this test, the 'static-position containing block' is #shifted-column and the containing block for #red is established by the viewport.
+ 9.4 Normal flow
+ 9.4.1 Block formatting contexts
table-cell-background-local = Tests rendering of table cell's background-image with local attachment.
  • The local attachment background image of a table cell with overflow:hidden should be positioned in the scrolling area and clipped
+ 9.4.2 Inline formatting contexts
+ 9.4.3 Relative positioning
+ 9.5 Floats
float-no-content-beside-001 = CSS Floats — narrow containing block
  • If a shortened line box is too small to contain any content, then the line box is shifted downward
+ 9.5.1 Positioning the float: the 'float' property
float-nowrap-1 ≠ Floats in nowrap context
float-nowrap-2 = ≠ Floats in nowrap context
float-nowrap-3 = ≠ ≠ Floats in nowrap context
float-nowrap-4 = Floats in nowrap context
float-nowrap-5 = Floats in nowrap context
float-nowrap-6 = Floats in nowrap context
float-nowrap-7 = ≠ Floats in nowrap context
float-nowrap-8 = ≠ Floats in nowrap context
float-nowrap-9 = ≠ ≠ Floats in nowrap context
floats-line-wrap-shifted-001 =
  • Float may not be higher than line-box containing a box generated by an element earlier in the source document.
floats-placement-001 =
  • This test checks placement of inflow content with floats present.
floats-placement-002 =
  • This test checks placement of inflow content with floats present.
floats-placement-003 =
  • This test checks placement of inflow content with floats present.
overhanging-float-paint-order =
+ 9.5.2 Controlling flow next to floats: the 'clear' property
floats-clear-multicol-000 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-001 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-002 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-003 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-balancing-000 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-balancing-001 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-balancing-002 = Test the clear position after the floating elements breaking across multi-columns
floats-clear-multicol-balancing-003 = Test the clear position after the floating elements breaking across multi-columns
+ 9.6 Absolute positioning
+ 9.6.1 Fixed positioning
fixed-z-index-blend = fixed position, z-index, and mix-blend-mode
  • Tests fixed, z-index, and mix-blend-mode. Passes if there is a green box when the page is scrolled to the bottom.
+ 9.7 Relationships between 'display', 'position', and 'float'
display-computed Script CSS Display: getComputedStyle().display
  • position and float can change display computed value.
  • display computed value is otherwise as specified.
grid-computed-value-display-floated-items-001 DOM/JSScript 'float' affects to the computed value of 'display' on grid items
+ 9.8 Comparison of normal flow, floats, and absolute positioning
+ 9.8.1 Normal flow
+ 9.8.2 Relative positioning
+ 9.8.3 Floating a box
+ 9.8.4 Absolute positioning
+ 9.9 Layered presentation
+ 9.9.1 Specifying the stack level: the 'z-index' property
z-index-does-not-apply = z-index doesn't apply to transformed content which is not positioned
z-index-interpolation Script z-index interpolation
  • z-index supports animation
fixed-z-index-blend = fixed position, z-index, and mix-blend-mode
  • Tests fixed, z-index, and mix-blend-mode. Passes if there is a green box when the page is scrolled to the bottom.
invalidate-opacity-negative-z-index =
z-index-blend-will-change-overlapping-layers = z-index, will-change, mix-blend-mode on overlapping layers
  • Tests z-index, will-change and mix-blend-mode on overlapping layers. Passes if there is a green bar when the page is scrolled to the bottom.
contain-layout-stacking-context-001 = 'contain: layout' with stacking contents. Z-index is defined only for siblings and children.
contain-paint-stacking-context-001a = 'contain: paint' with stacking contents. Z-index is defined only for siblings and children.
contain-paint-stacking-context-001b = 'will-change: contain' with stacking contents. Z-index is defined only for siblings and children.
+ 9.10 Text direction: the 'direction' and 'unicode-bidi' properties
bidi-span-001 = Inline boxes should not affect bidi reordering
bidi-span-002 = Inline boxes should not affect bidi reordering
bidi-span-003 = Bidi reordering with inline boxes
unicode-bidi-parsing-001 DOM/JSScript CSS Writing Modes: parsing unicode-bidi: normal, embed, bidi-override
  • This test asserts the parser and getComputedStyle works correctly for the unicode-bidi: normal, embed, bidi-override.