Как сверстать блок с картинкой?

Question

[Иван Беловиков]

Как реализовать такую форму для картинки на чистом CSS3?

Answer 1

[WapSter]

https://caniuse.com/#search=clip-path

Comments

[Иван Беловиков]

а как border задать?? я пытался, он не полностью обволакивает

[WapSter]

Иван Беловиков, у тебя в примере нет бордера. Ну а так делаешь еще одну обертку чуть больше изображения, задаешь ей цвет бордера фоном, с теми же параметрами clip-path, и задаешь pos:r, картинку позиционируешь в центре, и будет иллюзия бордера.