Есть блок
<div class="container">
<h1>Заголовок</h1>
<div class="black_map">
<img class="tool tool-1" data-html="true" data-toggle="tooltip" title="текст" src="images/tooltip.png" alt="">
<img class="tool tool-2" data-html="true" data-toggle="tooltip" title="текст" src="images/tooltip.png" alt="">
<img class="tool tool-3" data-html="true" data-toggle="tooltip"
title="текст" src="images/tooltip.png" alt="">
<img class="tool tool-4" data-html="true" data-toggle="tooltip"
title="текст" src="images/tooltip.png" alt="">
<img class="tool tool-5" data-html="true" data-toggle="tooltip"
title="текст" src="images/tooltip.png" alt="">
...
<img class="tool tool-13" data-html="true" data-toggle="tooltip" title="" src="images/tooltip.png" alt="">
</div>
</div>
CSS
.black_map {
position: relative;
background: url(../images/map.png) 100% 100% no-repeat;
background-size: cover;
height: 587px;
}
.tool {
position: absolute;
}
.tool-1 {
bottom: 207px;
left: 73px;
}
.container{max-width:1140px}
Вопрос - нужно строго спозиционировать точки на карте. Я уже исчерпал всю свою фантазию как это сделать, чтобы при уменьшении размеров окна точки не смещались.
background-size: cover
, аbackground-size: 100% 100%