Элементы меню с треугольными краями

[Vulner]

Добрый день! Подскажите, пожалуйста, как можно более гибко реализовать треугольники по краям элементов меню. Вот пример http://jsfiddle.net/Ewuvv/3/ . Можно ли как-то сделать так, чтобы они автоматически подгонялись по размерам(например при уменьшении/увеличении шрифта элементов меню)? И в чем причина отображения темной границы у треугольников в FF?

Edited June 18, 2013 by Vulner

[SelenIT]

Можно ли как-то сделать так, чтобы они автоматически подгонялись по размерам(например при уменьшении/увеличении шрифта элементов меню)?

Да, если указывать толщину границ в em-ах (равно как и line-height с padding-ами, чтобы точно знать суммарную высоту в em-ах же).

в чем причина отображения темной границы у треугольников в FF?

transparent — это не просто прозрачный, а прозрачный черный (синоним rgba(0,0,0,0)). А FF пытается сглаживать границу треугольника, строя плавный переход из цвета в цвет а-ля градиент. Обходится заданием прозрачного цвета через rgba(241,241,241,0) и т.п.

[Vulner]

Благодарю за ответ! Теперь все как надо