css box shadow + прозрачные фоновые изображения = интуитивная разбивка
- У меня есть изображение кнопки, которое я использую в качестве фонового изображения для некоторых ссылок.
- У фонового изображения закруглены углы.
- Я хочу использовать тень css вместо того, чтобы размещать тень на изображении.
Проблема в том, что тень кажется нарисованной вокруг элемента. Хотя я ожидал увидеть цвет тени через прозрачные части фонового изображения, вместо этого я вижу цвет фона ( см. этот jsfiddle ).
Моя реальная цель немного сложнее, но если я смогу выполнить первые три пункта списка, я смогу выполнить эту задачу. В частности, я хочу использовать два вложенных элемента с фоновыми изображениями правой и левой частей изображения кнопки (закругленные углы), чтобы я мог использовать один и тот же css для обертывания «кнопки» вокруг текста любой длины. Поскольку фоны перекрываются в стиле css «раздвижные двери», тень альфа-канала png показывает 2-кратный темный участок, где изображения перекрываются. Итак... Я думал, что буду использовать тень css, но, как вы можете видеть в jsFiddle, с этим тоже есть проблемы.
Есть идеи?