Как отрезать край у блока оставив ему тень и загнутый уголок?

Question

[Полина Емельянова]

Коллеги, добрый день.
Прошу вас подскажите наиболее удобоваримый вариант для отрезания края у блока.
САБЖ: есть контейнер, которому надо "загнуть уголок" и пи этом не потерять тень контейнера. При чем сама тень, должна огибать сгиб.

Подробно на скриншоте


Clip-path - не пашет, обрезается общая тень блока.
Классическое решение с треугольным элементом как раз наоборот, не отрезает тень у этого угла.
Решение с градиентом - тоже не подходит, по этой же причине.

Прошу, подскажите, как можно было бы отрезать угол и тень оставить только там, где она нужна.

Заранее благодарю за помощь!

Answer 1

[Aetae]

Если поддержка осла не нужна - обрезайте как хотите, а для тени используйте filter: drop-shadow().

Если нужна поддержка осла, и нужна поддержка любого фона - имитировать тень и обрезку множественными linear-gradient или использоватьborder-image. Если осёл нужен, но фон однотонный - просто перекрыть угол с тенью.