CSS text filling with water
codepen.io
codepen.io
In other words, if you're a Firefox user, open it in Chrome to see the actual effect.
Looked at it in chrome, very cool.
Flexbox is usable in the latest versions of most browsers today[2]. Here's an example of declarative centering: http://jsfiddle.net/ac4ug/
[1]: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexi... [2]: http://caniuse.com/#feat=flexbox
Sure, there are varying levels of support of the most bleeding edge features, but browsers are catching up with each other all the time. For real world sites, you use what's widely available, which corresponds to the gee-whiz demos from 5 years ago (give or take, and depending on how many truly obsolete users you need to support). So yeah, this isn't really all that useful outside of a gee-whiz demo now, but in a few years all of the major browsers will support it and people can use it. This kind of effect is most likely to be used in a game that has a large asset library to load, but the underlying functionality can be useful in a variety of designs.
I'm on a pretty beefy Macbook most of the time and there are a lot of simple-looking sites that are almost impossible to use because of the slow-down from their page effects. The scrolling behavior from parallax or fixed effects really seem to be the worst.
If you want to see the next wave of CSS effects, just check out one of the old copypasta providers like DynamicDrive or FlashKit. ;)
Thanks!
Win7 x64.