Создаю карту ссылок на картинке. Проблема в том, что картинка вылезает за родительский блок, поэтому я уменьшаю ее с помощью position: relative; width: 100%. Но после этого карта ссылок остается на том же месте, будто бы размер картинки остался прежним. Пробовала каким-то образом изменять размер карты ссылок, но она на любые изменения в css вообще не реагирует. Можно ли как-то оставить картинку внутри блока, при этом засунув ее туда вместе картой?
<div id=main>
<img id=img-world src='world.jpg' usemap="#world-map">
<map id=world-map name=world-map>
<area shape=poly coords="503,596, 409,614, 379,628, 376,679, 407,690, 401,709, 427,725, 573,723, 606,699, 631,682, 631,621, 589,605" href="asgard.html" alt="Асгард">
</map>
</div>
#img-world {
position: relative;
width: 100%;
}
#main {
position: absolute;
top: 120;
min-height: 500;
right: 10%;
left: 10%;
}