Do you think CSS will ever have the ability to provide round borders and how will it be accomplished?
+1
A:
Border-radius: create rounded corners with CSS!
This box should have a rounded corners for Firefox, Safari/Chrome, Opera and IE9. The code for this example is, in theory, quite simple:
#example1 {
border-radius: 15px;
}
However, for the moment, you’ll also need to use the -moz- prefix to support Firefox (see the browser support section of this article for further details):
#example1 {
-moz-border-radius: 15px;
border-radius: 15px;
}
Pranay Rana
2010-08-13 04:53:01
+3
A:
Yes. CSS3 already has it.
Many browsers already have it.
- In Mozilla/gecko browsers you need
-moz-border-radius
. - In Safari/Chrome/webkit browsers you need
-webkit-border-radius
. - In future when CSS3 is widely adopted you'll just need
border-radius
.
thomasrutter
2010-08-13 04:54:58
`border-radius`, not `-border-radius`
SpliFF
2010-08-13 04:57:52
woops - thanks...
thomasrutter
2010-08-13 05:05:24
+1
A:
What Thomas Rutter said, plus here is a handy resource because WebKit and Gecko use different properties for things such as top-left
.
alex
2010-08-13 04:56:56