|April 4, 2011||25 comments|
Super hot color gradient glowing action by Kayla Rose.…
|April 2, 2011|
Snook reminds us we can set the top/left (or bottom/right) when absolutely positioning textareas, but not all four values (which cannot out-force the width/height). …
|April 1, 2011|
Get a gridded up background-image on-the-fly.
|April 1, 2011|
This article was originally published on March 2, 2010. It is now updated to include the latest browser support and syntaxes.
July 20, 2011: Updating again for syntaxes…
Safari 4+, Chrome 1+, Firefox 3.6+, and Opera 11.10+ are all now …
|April 1, 2011||95 comments|
Reader Jason Lucchesi send me in a neat demo of image captions sliding in overtop an image on rollover. The effect used a bunch of nested divs to get it done, so I thought I’d do my own version of …
|March 29, 2011||59 comments|
You can align text to the left, right, or centaur.…
|March 28, 2011|
CSS Pivot allows you to apply your own CSS to a site and then share the results (you get a unique URL which opens up that site in a top-bar/iframe dealy). Pretty clever stuff. If you saw a tweak of …
|March 27, 2011||41 comments|
Hover states are easy, but what if you want to apply a hover state to every element besides the one you are hovering over? We can do it with a little trickery.
|March 23, 2011||55 comments|
June 24-25, 2011 in Columbia, South Carolina. It was awesome last year and this year should be ever better as it’s at a nicer venue and I’ll be speaking at it! $150 bucks for both days = super affordable as …
|March 22, 2011|
Article I wrote for the new online version of .net magazine.…
|March 22, 2011|
Another little thing I learned from Estelle at the SXSW 2011 CSS3: Beyond The Basics panel was that you can comma separate the keyframe values in a WebKit animation declaration. Let’s say you wanted to create a pulsing effect as …
|March 22, 2011||6 comments|
Really cool audio player by simurai using HTML5 <audio, jPlayer (jQuery plugin), and CSS3 for the fancy animations. This made the rounds a few months back but I decided to wait until it was on GitHub, which then happened …
|March 21, 2011|
A code generation and visualization tool by Matthew Lein for CSS3 transition timing functions. Biggest triumph? Making cubic bezier understandable. …
|March 21, 2011|
If you see any mistakes or missing info, please report it. We want to make this as accurate and comprehensive as possible.…
|March 21, 2011|
Heads up: there is a conditional comment for targeting Internet Explorer on Windows Phone 7 mobile devices. Plus, other random thoughts.
|March 21, 2011||32 comments|
This has almost nothing to do with web design, but I want to help promote an event going on in Northern Wisconsin put on by some friends of mine: Crivestivus.
They used to hold it just for friends and …
|March 19, 2011||7 comments|
There is a very low chance this would ever happen, and as far as I know nobody is talking about it seriously. I think it might make for an interesting discussion and poll though:
Do you wish there was conditional …
|March 18, 2011||94 comments|
|March 17, 2011||17 comments|
Cool idea and execution by Wade Hammess.…
|March 15, 2011|
Load up Yepnope.js
Yepnope is …
|March 13, 2011||48 comments|
If you are at SXSW, Kevin Hale and I are talking about HTML5 forms and using them to improve lead generation (and generally how to make your forms better). It’s a 2.5 hour workshop which we intend to be fun, …
|March 11, 2011|
Roger Johansson has a neat quick-tip style article on centering page content both vertically and horizontally by making the html element
|March 10, 2011||41 comments|
A CSS3 technique for selecting only texty inputs, without the burdon of listing every single attribute selector for every single new HTML5 input type. Plus alternates.
|March 8, 2011||55 comments|
Long writeup about the experience Jeff Starr and I had self publishing our book.…
|March 8, 2011|
New must-subscribe-to site. Under the hood: curiously not HTML5. Almost feels rare these days. …
|March 7, 2011|
Little download packages by Mark Pilgrim that contain @font-face files that are super tiny because they contain just a single character: the ampersand. They come with an HTML demo so using them is an easy copy-and-paste job.…
|March 7, 2011|
Microsoft themselves is tracking and promoting the demise of IE 6. China? 34.5%? Seriously?
And I can’t help but hum a little Europe:
We’re leaving together
|March 4, 2011|
Trevor Davis from Viget Labs with some clever and real-world implementations of pseudo elements.
There is so much to talk about with these pseudo elements it’s crazy. I’m speaking at a few conferences coming up and I’m putting together a …
|March 3, 2011|
Randomly this week, I’ve had more-than-normal number of comments from folks who ask me something like:
Went to go tweet/share a blog post of yours, and noticed you don’t have any of those on your site. Interesting, any reason why?…
|March 3, 2011||102 comments|
Kind of a classic little trick for ya’ll today. You know the
|March 2, 2011||57 comments|
Declaring just ‘sans-serif’ as the font-family means you’ll get Helvetica on Mac, Arial on PC, and still have the good generic keyword fallback.
|February 28, 2011||54 comments|
jQuery plugin by Daniel Rapp to fill any element with background noise. Uses
|February 27, 2011|
Multiple background images is a cool feature of CSS3. The syntax is easy, you just comma separate them. I find it’s easiest/best to use the
|February 25, 2011||33 comments|
Just a fun experiment creating progress bars made with just CSS3 (no images). Loads of progressive nerdery packed into one little element.
|February 24, 2011||44 comments|
Bokuh is the effect of backgrounds in photographs with deep depth of field. Shapes round out and get blurry. Think of a really out of focus picture of a lighted Christmas tree. Divya Manian creates that effect in WebKit by …
|February 24, 2011|
Funny article from Thierry Koblentz on CSS selector efficiency. Although there are cases where multiple ID selectors are needed, a selector like
|February 21, 2011|
|February 20, 2011||25 comments|
As a follow up to asking people if they are using HTML5 or not, I asked the people who are:
What features of HTML5 have you used on production sites?
These are the levels of popularity, from almost 3,000 …
|February 17, 2011||30 comments|
When designing for print, having a properly calibrated monitor makes all the sense in the world. If done perfectly, what you see on the monitor should look like what you get on paper from a printer. No surprises.
When designing …
|February 15, 2011||76 comments|
Creating an image rollover is pretty easy with CSS. Give the element a background-image, then on it’s
|February 14, 2011||44 comments|
Just in case anyone doesn’t read Smashing Magazine, Eric Meyer has a long excerpt from his latest CSS book here which is loaded with good stuff. I particularly liked the bit about clearing :nth-child elements combined with media queries.…
|February 11, 2011|
A WebKit-only demo of a loading animation. Loading text slowly reveals itself over and over while a spinner rotates around in a circle over and over infinitely.
|February 10, 2011||29 comments|
You can set a max-width on the html element which helps keep fluid width sites under control with zero extra markup. Plus it’s got pretty good browser support with a No Big Deal™ fallback.
|February 9, 2011||21 comments|
|February 8, 2011||59 comments|
Good news everyone! This is fixed in both stable releases of the WebKit browser Safari (5.1) and Chrome (13)
It’s not every day you come across a solid bug in WebKit, which it seems to me leads the pack in …
|February 4, 2011||15 comments|
I bet a lot of you are using @font-face in your designs. It’s probably worth updating to this new syntax, which deals with IE9 and Android better than previous popular methods.…
|February 3, 2011|
In other words, “Different transitions on
|February 3, 2011||40 comments|
Sam Collins with a big writeup on his experience using media queries and comparing them against other mobile optimization techniques. There are lots of good practical tips to use inside your media queries like:
|February 1, 2011|
|February 1, 2011||29 comments|