Как сделать прозрачность у фонового изображения если за ним градиент?

Question

[Johnny]

Добрый день, подскажите можно ли сделать прозрачность у фонового изображения с одной стороны, при условии что за ним фон сделан градиентом? https://jsfiddle.net/crdd7sjh/

Если бы за этим слоем был блок одного цвета, например #fff, то можно было бы сделать градиент или box-shadow, а что делать в таком случае? (для лучшего понимания - https://jsfiddle.net/Lxz7p4a7/)

Answer 1

[Денис Инешин]

https://css-tricks.com/clipping-masking-css/#artic...

Comments

[Johnny]

Спасибо, помогло, а нет более кроссбраузерного решения?

[Денис Инешин]

Johnny: более кроссбраузерно - нарисовать эту прозрачность в фотошопе для картинки)

[Johnny]

Не получится, т.к. у блока меняется ширина, соответственно картинка обрезается