Articles by CSS Tricks from April 2013

That would be pretty useful, right? Right now it's very common to User Agent "sniff" when you want to make a server-side decision about what to give the client. But UA sniffing has always sucked and s...

WebP images are save a quarter to a third of the file size over PNG or JPG. Not all browsers are going to support it, but Bruce Lawson shares a way we can use it in such a progressive enhancement kind...

Sometimes people ask me if they can use the stuff they find here. So I thought I'd create a license I can refer them to. Direct Link to Article — Permalink…The CSS-Tricks License is a post...

Not the most glamorous property is it? But it just might turn out to be. Things like paginated overflow and overflowing into fragments, each of which is selectable and style-able. Could be pretty powe...

Despite the super fun sounding name, magic numbers are a bad thing. It is an old school programming term for "unnamed numerical constant". As in, just some number plunked into the code that is probabl...

I think the most common tech question we get on ShopTalk show is how to keep a WordPress database in sync between live and local. This (paid) plugin can do it right from one admin screen to another by...

The issue is 1) custom fonts are awesome and we want to use them 2) custom fonts slow down our pages by being large additional resources. Dealing with this has been in the air recently so I thought I'...

Forums user McAsh wondered how they might code up a design in which there was a large header and a smaller subheader beneath it which featured double horizontal lines jutting out after the text to bot...

Like the little handle on range inputs. You can style that, but it's different in all the major browsers. It's either ::-ms-thumb, ::moz-range-thumb, or ::-webkit-slider-thumb. Obviously an area that ...

Pasquale DSilvas article Transitional Interfaces has really been making the rounds. It's a quick read that that drives home a great point. Transitions and animations can be more than eye candy. They c...

A CSS redundancy analyzer that analyzes redundancy.Gives you output like:{.contact .content .primary} and {article, #comments} share 5 rulesIf you have multiple selectors sharing five or more rules (p...

It's no question that on sites with lots of JavaScript, you need a strict organizational pattern to keep everything making sense and the code approachable. I've mentioned in the past I like grouping t...

SITEOWNR: Thers new ifnormation inthe site foryou. (puts on sunglasses). STRETEMAN: yesyes Im hapy !Need a template for your WordPress website? The fine folks at The Theme Foundry have been building W...

Reader Arun wrote in with a question on how to make a body border that was rounded where the edges met on the inside. Like this. We've covered body borders before, but this was slightly different. It ...

Chrome is going to use "Blink" as a rendering engine now, a fork of WebKit. I imagine the Chromium team will stop committing back to WebKit, so that project will stagnate a bit. Safari is already rath...

POP has these cool hovers in the boxes that make up their homepage. The boxes have a white background by default, and as you hover over them a dark background slides up behind, the text colors change,...

In this first time ever in CSS-Tricks history, we're going to re-run the same poll we've ran in the past. Now, more than five years after the original poll, we're going to ask: What is your opinion as...

In this first time ever in CSS-Tricks history, we're going to re-run the same poll we've ran in the past. Now, more than five years after the original poll, we're going to ask: What is your opinion as...

Using SVG for background patterns is great because they 1) are very small 2) are vector, thus crisp at any screen resolution and 3) work in IE 9 (unlike gradients). Gallery by Philip Rogers.Direct Lin...

From over 16,000 people surveyed, more than half (54%) say they "do some" when it comes to alt text for images that are important to content. The example provided did provide insight into the content ...

If you need to indicate "please wait, something is happening" on a website, a spinner has long been the go-to choice. Probably an animated GIF, although there are other options like CSS animations, ap...