В моем приложении я делал div карты как
<div id="map" style="height: 610px; width:100%"></div>
но чтобы сделать мою карту отзывчивой, я хочу сделать высоту также на 100%, если я делаю height: 100% тогда она не работает.
Как я могу сделать высоту также переменной шириной, чтобы можно было правильно отображать карту на любом устройстве.
Демо: http://jsfiddle.net/CcYp6/
Если вы измените высоту и ширину карты, вы не получите карту.
Вам нужно установить родительские элементы на height: 100%; первый
html, body {
height: 100%;
}
Демо (это не будет работать, поскольку высота родителя не определена)
Объяснение: Зачем вам это нужно? Поэтому, когда вы указываете высоту элемента в % тогда возникает 1-й вопрос: 100% чего? По умолчанию div имеет высоту 0px, поэтому 100% для div просто не работают, но устанавливают height родительских элементов на 100%; будет работать.
Вы должны установить размер div с помощью JavaScript.
$("#map").height($(window).height()).width($(window).width());
map.invalidateSize();
Вы можете найти полный пример здесь.
Использование height = "100vh" работает в новом браузере. но это нормально.