I have an image for a background for a div that doesn't exactly fit. Is there a way, using css, to change the size of the image (e.g. background-size:10%)?
.header-tab { background: transparent url(/resources/images/light-green-gradient.png) repeat-x scroll 0 0; }
background-size is a css3 value which can be set
see: http://www.w3.org/TR/css3-background/#the-background-size
or use this method http://css-tricks.com/how-to-resizeable-background-image/
background-size isn't implemented yet in any browser, but there is -*-background-size for the newest versions of Mozilla, Webkit, Konqueror and (buggy) Opera:
background-size: 10%;
-moz-background-size: 10%;
-o-background-size: 10% auto; /* Opera needs x AND y values, or no background! */
-webkit-background-size: 10%;
-khtml-background-size: 10%;
Don't use it in Opera together with background-attachment:fixed.
Mozilla Developer Center has more and a workaround for Firefox 3.5.
For older browsers, you can emulate it with an img like in Jimmy's second link, but then of course you'd have to figure out how to hide that image from new browsers.