Почему drop shadow и box shadow дает разный результат?

Question

[liltrill]

Одни настройки разные тени, почему так?

Comments

[Rustam Bainazarov]

Потому что это разные вещи для разных вещей.

[liltrill]

Рустам Байназаров, я понимаю у меня там еще обтекаемая стрелочка будет вот поэтому нужен drop shadow

[Rustam Bainazarov]

liltrill, кстати, у вашего box-shadow отсутствует четвертый параметр:
https://jsfiddle.net/oe1Lpku0/

Покажите то, что вам там там надо сделать. Применять drop-shadow для создания тени типичного бокса — очень плохая практика.

Вообще, у них разная система просчёта размеров, поэтому и результаты разные.

[Rustam Bainazarov]

Если интересно, можете почитать:
https://drafts.csswg.org/css-backgrounds-3/#box-shadow

[liltrill]

Рустам Байназаров,

Вот это, с красивой тенью

[liltrill]

Рустам Байназаров, Поменял размер размытия, подогнал к нужнмоу виду и стало все нормально. Кстати такой способ создания меню со стрелочкой не являеться плохой практикой?

[Rustam Bainazarov]

liltrill, нет, clip-path это хорошо, просто в старых браузерах тут будет квадрат, поэтому часто делают на border или крутят квадрат с помощью transform.

[liltrill]

Рустам Байназаров, Понял, спасибо)

Answer 1

[liltrill]

Расчет в box-shadow и drop-shadow разный, в моем случае пришлось изменить box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.12) на drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.12)