Why is Yandex map not displayed?

M

mrRoss2016-11-16 12:37:59

Yandex maps

mrRoss, 2016-11-16 12:37:59

I'm trying to initialize the simplest example of Yandex.Maps, but it is displayed only if it is
not enclosed in my divs...
Some strange story... It's
worth writing:

<div id="my">
<p>Карта</p>
<div id="map"></div>
</div>

And the card stops working.
Below is the page code...

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Примеры. Размещение карты на странице.</title>
    <!--
        Подключаем API карт
      Если вы используете API локально, то в URL ресурса необходимо указывать протокол в стандартном виде (http://...)
    -->
    <script src="(http://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
    <script>
    var myMap;

// Дождёмся загрузки API и готовности DOM.
ymaps.ready(init);

function init () {
    // Создание экземпляра карты и его привязка к контейнеру с
    // заданным id ("map").
    myMap = new ymaps.Map('map', {
        // При инициализации карты обязательно нужно указать
        // её центр и коэффициент масштабирования.
        center: [55.76, 37.64], // Москва
        zoom: 10
    }, {
        searchControlProvider: 'yandex#search'
    });



}
  </script>
  <style>
        #my{
            
            color:red;
        }
        #map {
            width: 100%;
            height: 90%;
        }
    </style>
</head>

<body>
    
<div id="my">
<p>Карта</p>
<div id="map"></div>
</div>

</body>

</html>

Hope for help. Thank you.

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

M

mrRoss, 2016-11-16
@mrRoss

It was necessary to set the height not in percentages, but in px ...
The problem is solved.