- CSS Unleashed – Experiments with CSS Designs
- CSS Book Recommendations
- CSS Experiments Playing With CSS Blocks
- CSS Experiments with CSS Logo Designs
- CSS Experiments with Background Images and Backgrounds
- CSS Experiments with Lists, Menus, Tables of Content, and More
- CSS Experiments – Web Fonts and Embedded Fonts
- CSS Unleashed – Experiments with Quotations, Pull-quotes and Blockquotes
- CSS Unleashed – Experiments Showcasing Your Photography
- CSS Experiments – Variations on a Theme
- CSS Experiments – How They Were Done and More
- CSS Experiments Putting It All Together
Think of CSS divisions and spans as children’s toy building blocks. Give them a background. Fill them with text. Flip them around and see what you can come up with through the creative use of CSS in your CSS experiments.
As with many of these CSS experiments, they don’t all work equally under different web browsers. Sideways text using the flipv and fliph filters don’t work equally across the browsers. Currently, these will only work with Microsoft Internet Explorer as they are proprietary to that browser. These can also break in various browsers and page widths. Narrow the window size or change the browser’s font size and these might fall apart. Still, they are CSS experiments and ideas worth exploring.
For more information on how these were done and how to use these CSS design elements and style experiments, see CSS Experiments – How They Were Done and More and CSS Experiments Putting It All Together.
To see how these CSS experimental boxes and styles work, view the source code of the page. In your web browser menu, click VIEW > SOURCE or VIEW > PAGE SOURCE to view the source code. For the most part, the styles are included inline with each design.
If you find a way of improving or expanding upon these CSS experiements, let us know by leaving a comment below.
This first group of examples uses the vertical flip filter found in Internet Explorer only. It should look like the words “The closer” are across the top and “one” is turned on it’s side.
THE FARTHER ONE SEES.