Как задать рамку блоку с яндекс картой?

Question

[Андрей Бесчастный]

Как обрамить яндекс-карту следующим образом: https://yadi.sk/i/iQKB5mm4k5UHF ?

Comments

[Ivanq]

Ссылка нерабочая

[Андрей Бесчастный]

Ivanq: спасибо, исправил

Answer 1

[Павел Радьков]

Поверх блока с картой абсолютом спозиционировать картинку с маской. Картинку лучше сделать svg — меньше килобайт, плавные контуры при масштабировании.

Чтобы клики проходили сквозь картинку, задать ей pointer-events: none.
Работает уже почти везде caniuse.com/#feat=pointer-events
Там где pointer-events не работает не делать маску. Детектится через modernizr.

Тут еще примеры paulradzkov.com/2012/pointer-events

Answer 2

[Дмитрий Скогорев]

например диву с вашей картой дать css

border-radius: 50%;
width: 50%;
height: 100%;