A List Apart

Menu
Issue № 309

CSS3: Learn to love vendor prefixes, and create full-screen backgrounds that resize to fit the viewport.

Supersize that Background, Please!

by Bobby van der Sluis48 Comments

Background images that fill the screen thrill marketers but waste bandwidth in devices with small viewports, and suffer from cropping and alignment problems in high-res and widescreen monitors. Instead of using a single fixed background size, a better solution would be to scale the image to make it fit different window sizes. And with CSS3 backgrounds and CSS3 media queries, we can do just that. Bobby van der Sluis shows how.

Prefix or Posthack

by Eric Meyer58 Comments

Vendor prefixes: Threat or menace? As browser support (including in IE9) encourages more of us to dive into CSS3, vendor prefixes such as -moz-border-radius and -webkit-animation may challenge our consciences, along with our patience. But while nobody particularly enjoys writing the same thing four or five times in a row, prefixes may actually accelerate the advancement and refinement of CSS. King of CSS Eric Meyer explains why.

More from A List Apart

Columnists

Matt Griffin on How We Work

Being Profitable

So you own a business. It’s the best job you’ve ever had, and it will be forever—as long as the business stays viable. That means understanding when it's profitable, and when you may have to make some adjustments. Don’t worry—it doesn’t require an accounting degree and it won’t turn you into a greedy industrialist.

From the Blog

Valediction

When I first met Kevin Cornell in the early 2000s, he was employing his illustration talent mainly to draw caricatures of his fellow designers at a small Philadelphia design studio. Even in that rough, dashed-off state, his work floored me. It was as if Charles Addams and my favorite Mad Magazine illustrators from the 1960s had blended their DNA to spawn the perfect artist.