HTML5 range inputs, in supported browsers and by design, don’t show the user the actual value they are submitting. If you want to use the cool slider, but show the value, you’ll have to do that yourself. Here we use the output element and jQuery to show the current value in a bubble that hovers above the range input.
Use JavaScript to trigger the playing of a sound (an HTML5 audio element). A couple of ways to do it are presented here, along with a few gotchas to watch for.
A fun thinking exercise for CSS nerds! What if all elements defaulted to relative positioning instead? What are the advantages, disadvantages, and caveats to consider…
Highlight text, reveal an actual image beneath! Not possible with the text selection pseudo class, but is possible by wrapping selected text in spans via an open source JavaScript library and adding the background image to that.
This article was originally published on March 2, 2010. It is now updated to include the latest browser support and syntaxes.
Safari 4+, Chrome 1+, Firefox 3.6+, and Opera 11.10+ are all now supporting CSS3 gradients. This wide browser support makes using them for progressive enhancement all the more appealing. More good news, CSS3 gradients fall into the camp where you can specify fallbacks (i.e. images) so that browsers that don’t support them just use the image instead. …
Right on the heels of IE 9's release, there is already a platform preview for IE 10 (video).
Awesome: Flexbox, Grid, Multi-column, Gradients, (and soon), Transitions and 3D Transforms
Not awesome: No text shadow, No HTML5 Forms support
July 22, 2011 - St. Petersburg, Florida. This is the third year going. Two years ago, I spoke at the first one which was my first "real" speaking gig ever. This year I'll be talking CSS, which, strangely enough, I've never talked about live before. Specifically, pseudo elements.
Marco Kuiper with some real world examples of how the :any() selector (already live in Firefox 4 and WebKit nightlies) can clean up otherwise clunky selectors.
Turns out there is a simple way to accomplish gradients on borders. That took me longer than it should have to arrive at though, this screencast covers all the ways I tried and looked at along the way.
Links from Video:
