CSS Backgrounds and Borders Module Level 3 CR Test Suite

Rounded Corners (14 tests)

Test Refs Flags Info
+ 4 Rounded Corners
+ 4.1 Curve Radii: the border-radius properties
border-radius-interpolation Script border-radius interpolation
  • border-radius supports animation by computed value
border-bottom-left-radius-composition Script border-bottom-left-radius composition
  • border-bottom-left-radius supports animation by computed value
border-bottom-right-radius-composition Script border-bottom-right-radius composition
  • border-bottom-right-radius supports animation by computed value
border-radius-012 =
border-top-left-radius-composition Script border-top-left-radius composition
  • border-top-left-radius supports animation by computed value
border-top-left-radius-values-001 'Border-top-left-radius' with two values.
  • The first value of the 'border-top-left-radius' is the horizontal radius of the rounded corner and the second value is its vertical radius.
border-top-left-radius-values-002 'Border-top-left-radius' with one value.
  • 'Border-top-left-radius' with an omitted second value has the vertical radius of the rounded corner equal to its horizontal radius.
border-top-left-radius-values-003 'Border-top-left-radius' with one value as 0.
  • If either value of 'border-top-left-radius' is 0 then the corner is a square.
border-top-right-radius-composition Script border-top-right-radius composition
  • border-top-right-radius supports animation by computed value
getcomputedstyle-border-radius-001 Script mixed units in calc() and computed border-radius longhand and shorthand values (complex)
getcomputedstyle-border-radius-003 Script mixed units in calc() and computed border-radius shorthand value (complex)
+ 4.2 Corner Shaping
+ 4.3 Corner Clipping
background-rounded-image-clip = Background Clip Follows Rounded Corner
border-radius-clip-002 = Background is clipped to the curve of the content-box when 'background-clip: content-box'
  • Background is clipped to the curve of the content-box when 'background-clip: content-box'
clip-rounded-corner = Filled Background with Rounded Corner
+ 4.4 Color and Style Transitions
+ 4.5 Overlapping Curves
+ 4.6 Effect on Tables