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

Question

[mletov]

Пожалуйста, подскажите, как сверстать такой переход с уголком.
Нашел пару боле-менее подходящих ссылок
htmlbook.ru/blog/treugolniki-cherez-css
Как сверстать такой уголок-разделитель максимально кроссбраузерно?

Но осложняет то, что фоны на обоих областях картинкой.

Или стоит уголок отдельно отрезать?

Answer 1

[Eugene Chefranov]

Изврат, но можно сделать квадрат, залить фоном, повернуть его и сверху наложить псевдоэлемент
https://codepen.io/chefranov/pen/RQVKJV

Comments

[mletov]

Спасибо. Ну это первое, что приходит на ум в различных вариациях.
Просто сейчас в каждом втором топике по верстке предлагают использовать svg и возможности css 3, думал, есть вариант посовременней.

Answer 2

[MrGaunt]

Clip path не то что вам нужно?
https://codepen.io/drewminns/pen/vEZOeq
https://getinstance.info/articles/css/making-sense...

Comments

[mletov]

Спасибо, опробую.
Не, не подойдет. работает только в WebKit.