[UPHPU] best method for css rounded gradient boxes

[Lonnie Olson]

On Dec 20, 2007, at 11:29 AM, miles wrote:
> I like to use Inkscape(SVG) to mock up my output pages (beats the  
> drawing on paper thing and Firefox & Safari users can display it in  
> the browser for full effect).  I've drawn some nice looking gradient  
> boxes (with rounded corners).  Now I have to add it to my program so  
> I'm assuming I'll add it to the css.
>
> What is the best way to duplicate a gradient rounded box in css ?   
> a) fill the entire div with a png image with no-repeat ?  b) slice  
> the image and go the 4 corners route with transparent pngs ?
> the entire image seems the easiest but I'm wondering about  
> performance of downloading large images especially when there are  
> several / page.
> any suggestions ?

Take a look at these articles for some ways to do it.

http://www.alistapart.com/articles/customcorners/
http://www.alistapart.com/articles/customcorners2/

--lonnie