Firefox 3.6 has become the latest browser to support the CSS3 background-size property (although the first to do so according to the latest W3C spec.).
Using it is pretty simple:
div {
background-image: url('image.png');
-moz-background-size: 80%;
}
This, along with multiple background-images, is going to go a long way towards cleaning up mark-up and prettifying the web.
A very nice addition, though I’m still waiting to crop a defined area from a background image. This would bring real power to using sprites and think would have a huge impact on how we handle background images.
Niels Matthijs [August 12th, 2009, 8:44 am]
Niels, someone’s working on a patch for that at the moment, and it’s pretty close to being done. I don’t know whether or not it will make the immediate next release, because we recently split the codebase into a copy slated for the next release and a copy slated for continuing development. It’ll definitely land in the latter; I don’t know whether it’s planned to get it in the former (which might mean diverting attention from other next-release items to do so, since at a certain point every new thing to do means it takes that much longer to make the actual release).
Beyond that, there’s other background fun coming down the pipe as well, but I’m not going to steal other people’s thunder and mention anything specifically. However, it’s all in bugzilla.mozilla.org if you’re willing to make the effort to find it.
Jeff Walden [August 17th, 2009, 10:27 pm]
Further to Jeff’s comment, I see that that feature has landed: –moz-image-rect.
Peter [August 23rd, 2009, 11:38 pm]
I’ve written a post about the new background clipping feature at CSS3.info:
http://www.css3.info/firefox-3 – 6-adds-background-clipping/
Peter [August 27th, 2009, 11:34 am]