Rounded Corners using CSS

Question

Is it possible to create rounded corners using CSS without using little graphic chunks for the corner?

Answer 1

Not in current css spec, and it wouldn't be supported by all browsers

Answer 2

Yes, preferable if you know your table has a fixed width or height.

And if you want dynamic for both, you can create a div header and footer for the table. Under the div, set the corner image to float left and right and then clear both after that.

There is some tricks to get it done. If you need help, email me.

Answer 3

It is possible to make rounded corners with only html and css, without graphics.

Draw DIV with padding=3 and height=1

Then DIV with padding=2 and height = 1

Then DIV with padding=1 and height=1

and then div with some content

may be, there should be more DIVs and another paddings, but this is an idea

and the picture is

...********...

..**********..

.************.

some content

Answer 4

Not yet, but it's in the next CSS draft. Who knows when it will get here.

Answer 5

The little rounded corners are done (without the graphic chunks) with a CSS property called -moz-border-radius ...and you can specify it for all four corners at once (shorthand) or you can specify -moz-border-radius-bottomleft or -moz-border-radius-bottomright and so on...So you need to look these up online to learn how to use them.

However, be aware that not all browsers handle them. Internet Explorer, for example, won't know what the heck you're talking about.