This is a collection of tests designed to reveal browser rendering issues. These cases document the various anomilies I have encountered in my CSS experiments. This suite will continue to grow over time.
Note: The "3d-transform-z-order" tests are a work in progress — the spec is ambiguous regarding element sorting so (for now) I've used Safari as my reference implementation. Treat any conclusions I've drawn with caution.
Test | This browser | Chrome | Firefox | Safari | IE |
---|---|---|---|---|---|
Content overflows with position: fixed | 43 | 38 | 8.0.6 | 12 |
Test | This browser | Chrome | Firefox | Safari | IE |
---|---|---|---|---|---|
Z scaled elements don't affect scrolling (overflow: auto) | 43 | 38 | 8.0.6 | 12 | |
Z scaled elements don't affect scrolling (overflow: hidden) | 43 | 38 | 8.0.6 | 12 | |
Z scaled elements don't affect scrolling (overflow: initial) | 43 | 38 | 8.0.6 | 12 | |
Z scaled elements don't affect scrolling (overflow: scroll) | 43 | 38 | 8.0.6 | 12 |
Test | This browser | Chrome | Firefox | Safari | IE |
---|---|---|---|---|---|
Z scaled elements don't affect scrolling bounds | 42 | 41 | 8.0.6 | 12 |
Test | This browser | Chrome | Firefox | Safari | IE |
---|---|---|---|---|---|
Z order test 1: single element transformed | 43 | 39 | 7.0.6 | 12 | |
Z order test 1: single element transformed / transposed DOM | 43 | 39 | 7.0.6 | 12 | |
Z order test 2: both elements transformed | 43 | 39 | 7.0.6 | 12 | |
Z order test 2: both elements transformed / transposed DOM | 43 | 39 | 7.0.6 | 12 | |
Z order test 3: z-index / single element transformed | 43 | 39 | 7.0.6 | 12 | |
Z order test 3: z-index / single element transformed / transposed z-index values | 43 | 39 | 7.0.6 | 12 | |
Z order test 4: z-index / both elements transformed | 43 | 39 | 7.0.6 | 12 | |
Z order test 4: z-index / both elements transformed / transposed z-index values | 43 | 39 | 7.0.6 | 12 |
Test | This browser | Chrome | Firefox | Safari | IE |
---|---|---|---|---|---|
Style generated content using ::first-line (display: block) | 43 | 39 | 8.0.6 | 12 | |
Style generated content using ::first-line (display: inline-block) | 43 | 39 | 8.0.6 | 12 |
Tests by Keith Clark - Find me on Twitter if you'd like to talk about them.