I'm Dudley Storey, the author of Pro CSS3 Animation. This is my blog, where I talk about web design and development with HTML, CSS and SVG. To receive more information, including news, updates, and tips, you should follow me on Twitter or add me on Google+.

my books

Pro CSS3 Animation book cover Pro CSS3 Animation, Apress, 2013

my other blogs

Massive Head Canon: Intelligent discussion of movies, books, games, and technology.

my projects

The New Defaults — A Sass color keyword system for designers.

CSSslidy — an auto-generated #RWD image slider. 3.8K of JS, no JQuery.

Web Developer Reading List: CSS Shapes and Masks

Using masks and shapes in CSS to create non-rectangular layouts

While there are many ways to mask content with CSS, until very recently, there weren’t any standardized, reliable methods of wrapping content around images. Lately, that has completely changed: new techniques and CSS modules have pushed web page layouts to the cusp of a revolution in design.

This reading list - constantly edited and growing - attempts to cover all of the applicable methods with useful, practical examples.

Time: 2 hours

Prerequisites: HTML and basic CSS

Resources

Read up on general approaches on how to create non-rectangular web designs.

Photograph by Andreas Voigt, used under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 license.

This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.