CSS3 'column-span'

A simple test of this handy CSS feature.

Posted:

The CSS Multi-column Layout Module has a rather interesting property called ‘column-span’ which means that certain elements can be spanned across more than one column - an example might be an image in a block of text..

I decided to test this new property to see if any browsers supported it.

Results

  1. Safari 5.0.3: No Support
  2. Chrome 7.0.517.44: Support for block-level elements - Yay!
  3. Opera 11: No support (and no support for CSS multi-columns)
  4. Firefox 3.6.13: No support

All tests have been carried out on a Mac, I haven’t been able to test any Windows versions of these browsers, so please let me know if you have any results & I will update this post.

An example

See the Pen CSS3 Multi-column spanning test by Zander Martineau (@mrmartineau) on CodePen.