The Lesser Known CSS3 Features

Everyone is always talking about text-shadow, gradients, rounded corners, multiple background images and a few others when it comes to CSS3. Probably because there is wide support for those properties in most modern browsers. However, what about regions, exclusions, flexible box, grid layout and hyphenation. It seems like these are getting left the dark considering very few browsers support them. What do you guys think of these odd children – worth being part of the permanent tool set or not?

btw… don’t feel bad if you have never heard of any of these things. I just learned about them a couple of weeks back and that is only due to Sencha Touch 2 which makes heavy use of flexible layout. Any way if you haven’t heard of them look them up and give some thoughts. Surprisingly Microsoft has some very good documentation on them all.

One thing I will say is even though iframes suck a big one the concept of regions is pretty neat. In many ways one could essentially use CSS3 regions as a sort of data access layer. Not sure if that is good or bad but it is pretty cool either way. On another shorter note though it seems like IE10 will not support calculations, surprising or not really (correct me if I am wrong but I did not see it in the previously mentioned document).

Yes, there’s a lot to be discovered about CSS3. It’s a bit overwhelming, really. There’s a fascinating video on this page (number 5):

5 CSS Magic Potions for your Layout Troubles from the Future

and this slideshow is interesting:

Thanks for this. These are pretty much new to me. Then again I suppose it’s because I generally aim for Crossbrowser compatibility and some of these aren’t really browser friendly. But I think I’m going to look more into these still.

There is a CSS3 tutorial over at tutsplus which i watched last weekend and learned a lot from just because there were CSS3 properties i had no idea existed which made slideshows and hover effects possible, hopefully when the CSS3 spec is complete a full overview will be clear to the public so tutorials on various sites can all be on the same page.