DarkLeafyGreen
DarkLeafyGreen

Reputation: 70466

Css rounded corners with border

I use css to apply rounded corners to li navigation elements. This elements have a border too.

So this is how it looks like:

enter image description here

Like you can see the quality of the rounded corner - border combination is strange, there is a bit of white shining through.

Any idea how to fix that? Do I have to use bg-images?

Upvotes: 1

Views: 603

Answers (2)

Hussein
Hussein

Reputation: 42818

Yes it can be done using this jquery plugin. http://jquery.malsup.com/corner/

No corner images, uses nested divs to draw borders. It's flexible and easy to use. It also has Added support for native border-radius so it only executes on browsers that do not support supports border-radius.

Upvotes: 0

BoltClock
BoltClock

Reputation: 724422

Unfortunately, yes, you should use background images. Some browsers don't properly handle actual borders with border-radius. You can even see this happening to Stack Overflow's badge styles (which also use border-radius) on Firefox. I don't think you can do anything to fix the border-radius issue other than to report bugs to the respective vendors.

Upvotes: 2

Related Questions