How to round Yandex.Maps?

V

Valery2012-10-01 09:34:19

css

Valery, 2012-10-01 09:34:19

Good morning,

maybe someone will tell you a sane way to round the corners of Yandex.Maps, except for overlaying on PNG?
A simple border-radius doesn't work, of course.

Reply

Answer the question

In order to leave comments, you need to log in

6 answer(s)

M

Makito, 2012-10-01
@Akuma

The easiest and most convenient way, if the border-radius does not work, oddly enough, the overlay of png images remains :)

1

100lker, 2015-06-17
@100lker

maybe someone still needs it, but I rounded it like this:
#map > ymaps {
border-radius: 5px;
overflow: hidden;
}
if you set rounding to the #map block, then it does not work.

S

spmbt, 2012-10-01
@spmbt

Found Yandex map webklad.net/index.php/lessons-of-a-theme/193-how-to-insert-yandex-a-card-on-a-site.html , applied to .YMaps.YMaps-cursor -grab border-radius:10px - works (Fx14). What is wrong with this method?

I

Ivan, 2012-10-01
@IvanTheCrazy

what if we "wrap" the map in an iframe?

U

Urvin, 2012-10-01
@Urvin

Google "how to hide inner elements in border-radius".
www.boogdesign.com/b2evo/index.php/firefox-img-rounded-corners-svg?blog=2

A

Andrey, 2022-02-08
@Andrey_PSK

Who will google:

<div class="map">
  <iframe src=" ссылка на карту " width="100%" height="100%" frameborder="0"></iframe>
</div>

.map iframe {
border-radius: 30px;
}