Rounded corners for less (Safari solution)
In addition to the previous article, I’ve got also a solution for the Safari 3.x users/developers out there. Like Mozilla, Apple added some CSS enhancements to their CSS-rendering engine. For getting the same effect as in Firefox, you can use -webkit-border-bottom|top-left|right-radius:
1 | <p style="-webkit-border-top-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; background-color: #ebebeb; padding: 10px; color: #000;">Lorem ipsum dolor sit amet, consectetuer sadipscing elitr, sed diam nonumy...</p> |
This should result in something like:
Lorem ipsum dolor sit amet, consectetuer sadipscing elitr, sed diam nonumy…
By the way: the W3C offers new options for border in CSS3, of which one is the border-radius stuff.