I need to create rounded corners without using images. Many articles written on this suggest the following solution: http://www.html.it/articoli/niftycube/index.html Is this the best way to create rounded corners without using images or there is a better way? If so, what other solution(s) are available?
It works, so long as you're okay having a script loaded to round your corners for you. You can do it without scripts, but then you have more markup in your HTML like here http://battletech.hopto.org/html_tutorials/rounded_css_borders/ You'll have to decide which is smaller in total filesize for you-- which depends on how many corners you're rounding. If it's like two boxes on a page, I feel the script is heavier than what you need. But if you're going while with the Web2.0 stuff and rounding every corner in site, then the extra markup (mostly adding a class to the box and <b class="whatever"><b><b><b></b></b></b></b>) will get rather ridiculous.
What is wrong with using one image to create your top set of rounded corners and one image for your bottom set? If you dont want to have to express the image on every page you can simply use something like a css class in a couple of blank divs like so: <div class="myimagetop"></div> <div class="myimagebottom"></div> .myimagetop { height:20px; width:1003px; background-image:url(images/myimagetop.gif); } Repeat style for bottom. Works fine.
Nothing, if the box you're setting corners for is a fixed with. Would work though if there was another div or something holding the other end of the image, so we'd have sliding doors working for flex-width boxes.