CSS Testing Ground
1. Introduction
A list of CSS coding examples to demonstrate and/or test how CSS works.
1.1. Abbreviations
- IE = Internet Explorer.
- ED = Edge Legacy 12 - 18 (EdgeHTML based) and Edge 79+ (Chromium based).
- FF = Firefox.
- SF = Safari.
- CH = Chrome.
- OP = Opera.
2. Visualize User Agent Or Bootstrap Styles
A visual demonstration of user agent or Bootstrap styles:
3. Visualize Bootstrap Media Query Viewport Breakpoints
A visual demonstration of Bootstrap media query viewport breakpoints:
4. Visualize CSS Style display: inline
Compared To display: inline-block
A visual comparison of CSS style display: inline
to display: inline-block
:
5. Visualize CSS Unit em
Compared To rem
A visual comparison of CSS unit em
to rem
:
6. Do the ol ol, ol ul, ul ol, ul ul
Descendant Selectors Style All Levels Of Various List Nesting Combinations?
A test to determine if the ol ol, ol ul, ul ol, ul ul
descendant selectors style all levels of various list nesting combinations:
7. Web Browser Support For The HTML placeholder
Attribute And The CSS *placeholder
Selectors On Textboxes And Textareas: Tests And Results
Tests to determine web browser support for the HTML placeholder
attribute and the CSS *placeholder
selectors on textboxes and textareas, and the results:
8. Web Browser Support For The New HTML5 Semantic Elements: Tests And Results
Tests to determine web browser support for the new HTML5 semantic elements, and the results:
9. Web Browser Support For The HTML noscript
Element As A CSS Type Selector And As A Classed Element: Tests And Results
Tests to determine web browser support for the HTML noscript
element as a CSS type selector and as a classed element, and the results:
10. Web Browser Support For Miscellaneous CSS Selectors, Styles, Properties, Values, And Units: Tests And Results
Tests to determine web browser support for miscellaneous CSS selectors, styles, properties, values, and units, and the results:
11. HTML Snippet To Be Styled By Font Not Installed On Computer Operating System Gets font-family
Style From User Agent Default Styles Standard/Default Font Setting, Not By Inheritance From body
Style Rule
Tests to determine how an HTML snippet styled with a font not installed on the computer operating system gets style: