Как растянуть яндекс карту на 100%?

Question

[mipfikus]

Код:

<script src="http://api-maps.yandex.ru/2.0-stable/?load=package.standard&lang=ru-RU" type="text/javascript"></script>
<div id="map" style="width: 100%; height: 100%"></div>
<script type="text/javascript">
    ymaps.ready(init);
    var myMap;
    function init(){     
        myMap = new ymaps.Map ("map", {
            center: [55.76, 37.64],
            zoom: 10,
        });
        myMap.behaviors.enable('scrollZoom')
         myPlacemark = new ymaps.Placemark([55.70, 37.60], {
            });
            myMap.geoObjects.add(myPlacemark);
    }
</script>

Если диву "map" задавать высоту в процентах - карта пропадает, если в пикселях - появляется.
Мне нужно растянуть карту на всю высоту блока, как это сделать?

Comments

[Владислав Лысков]

вся высота от чего, если он пустой?

[mipfikus]

Владислав Лысков, https://codepen.io/Mipfikus/pen/QWGGKZG

если поменять у блока высоту на проценты - пропадет

[FeST1VaL]

mipfikus, так от чего высота? что блоку задает высоту? ну можете попробовать так, может подойдет под вашу задачу... : height: 100vh;

[Владислав Лысков]

mipfikus, ну, а если ты сделаешь так
<div id="map" style="width: 100%; ></div>
то высота у него 0px, на какую высоту по твоему он должен расстанутся?

[mipfikus]

Владислав Лысков, точно. тупанул

[Сергей delphinpro]

Карты вообще не при чем.
Проблема в области понимания CSS в принципе.
Высота в процентах должна считаться от какого-то значения. Это главное непонимание начинающих.

Answer 1

[Артем Золин]

Добавьте высоту родителю или поставьте height: 100vh

Comments

[mipfikus]

Да, спасибо. Уже так и сделал

Answer 2

[freeExec]

Вариант с

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

рабочий, у вас в чём-то другом косяк.

Comments

[Сергей delphinpro]

с хрена ли он рабочий?
по дефолту — нет.
Условие, чтобы он был рабочим — у родителя должна быть задана высота.

[freeExec]

Сергей delphinpro, кто её задаёт?

[Сергей delphinpro]

freeExec, пушкин, блин.

[freeExec]

Сергей delphinpro, Откуда пушкин знает высоту окна у меня в браузере?