Css закругленные углы с рамкой

Question

Я использую css для наложения закругленных углов на элементы навигации li. Эти элементы также имеют границы.

Вот как это выглядит:

Как вы можете видеть качество закругленного угла - комбинация границ странная, сквозь нее просвечивает немного белого.

Есть идеи, как это исправить? Нужно ли использовать bg-images?

Answer 1

К сожалению, да, вы должны использовать фоновые изображения.Некоторые браузеры неправильно обрабатывают фактические границы с border-radius.Вы даже можете увидеть, что это происходит со стилями значков Stack Overflow (которые также используют border-radius) в Firefox.Я не думаю, что вы можете сделать что-либо, чтобы исправить проблему border-radius, кроме как сообщать об ошибках соответствующим поставщикам.

Answer 2

Да, это можно сделать с помощью этого плагина jquery. http://jquery.malsup.com/corner/

Нет угловых изображений, используются вложенные элементы div для рисования границ. Это гибкий и простой в использовании. Также добавлена ​​поддержка встроенного border-radius, поэтому он выполняется только в браузерах, которые не поддерживают поддержку border-radius.