Taking Your Camera on the Road

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". 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.

Authors, photographers, teachers, and public speakers, Lorelle and Brent VanFossen, travel extensively with their camera and pen in hand to bring you a variety of articles on nature and travel photography including basic nature photography and the photography business, writing, travel, recreational vehicles, web page design, and life on the road. All images, design, and content are copyrighted and protected by law.

You can find related articles to this topic in our Web Pages and CSS Tips and Tricks and Photographycategories. The previous post is CSS Unleashed - Experiments with CSS Logo Designs and the next post is CSS Unleashed - Experiments with Quotations, Pull-quotes and Blockquotes. CSS Unleashed - Experiments Playing With CSS Blocks, Issue Number 157, by Lorelle VanFossen, was updated September 2nd, 2006.

You can follow comments through the RSS 2.0 feed and you can find more feeds on our Feeds List. Your comment is welcome, as are trackbacks from your site.

Article Series - CSS Experiments

1. CSS Unleashed - Experiments with CSS Designs
2. CSS Unleashed - Variations on a Theme
3. CSS Unleashed - Experiments Playing With CSS Blocks
4. CSS Unleashed - Experiments with Background Images and Backgrounds
5. CSS Unleashed - Experiments with Lists, Menus, Tables of Content, and More
6. CSS Unleashed - Experiments with Quotations, Pull-quotes and Blockquotes
7. CSS Unleashed - Experiments Showcasing Your Photography
8. CSS Unleashed - Experiments with CSS Logo Designs
9. CSS Unleashed - Experiments Putting It All Together
10. CSS Experiments - How They Were Done and More

Next: CSS Unleashed - Experiments with Background Images and Backgrounds
Previous: CSS Unleashed - Variations on a Theme

Related Articles

• CSS Unleashed - Experiments with CSS Logo Designs
• CSS Unleashed - Variations on a Theme
• CSS Experiments - How They Were Done and More
• CSS Experiments - Web Fonts and Embedded Fonts
• CSS Unleashed - Experiments with Background Images and Backgrounds
• CSS Tips and Tricks
• CSS Book Recommendations
• CSS Unleashed - Experiments with CSS Designs

Submit Article: BlinkList | Blogmarks | Digg | Del.icio.us | Ekstreme Socializer | Feedmarker | Furl | Google Bookmarks | ma.gnolia | Netvouz | RawSugar | Reddit | Scuttle | Shadows | Simpy | Spurl | Technorati | Unalog | Wink | Yahoo MyWeb2