jVectorMap высота:% не работает

Question

Я использую эту библиотеку: http://jvectormap.com/, чтобы создать карту для моего сайта. Я пытаюсь установить ширину и высоту карты на 100% с помощью атрибута style, чтобы сделать отображение карты в полноэкранном размере.

Когда я указываю следующее:

<div id="map1" style="width: 100%; height: 100%"></div> 

На карте отображается следующим образом: атрибут

Ширина кажется работать правильно, однако атрибут высота не делает. Когда я изменяю размер окна, ширина масштабируется правильно, тогда как высота, по-видимому, постоянно увеличивается, независимо от того, масштабирую изображение вверх или вниз.

Как я могу сделать карту отображаемой с заданной шкалой с использованием процента?

Answer 1

Попробуйте это в вашем CSS:

head { 
    height:100%; 
} 
#map1 { 
    position:absolute; 
    height:100%; 
} 

Настройка высоты элемента головки на 100% устанавливает определение для того, что высота карта будет.

Answer 2

Вы также можете попробовать использовать вместо VH%

<div id="map1" style="width: 100%; height: 100vh"></div>