Как сделать чтобы отступы margin-bottom был динамический? Возможно ли прописать это в Yandex API ? Или как можно написать другой скрипт чтобы решить данный вопрос ?
Добавил карту на страницу однако их высота меняется так как ymaps генерирует разные классы, его класс автоматически автоинкрементится ymaps-2-1-60-map и значение в ном ymaps-2-1-60-map добавляется на 1, что будет ymaps-2-1-61-map
У меня на сайте 3 карты, прописал единственный скрипт js, самый простой.
//Show map on the web page
ymaps.ready(init);
function init(){
var myMap,
myPlacemark,
myMap2,
myPlacemark2,
myMap3,
myPlacemark3;
myMap = new ymaps.Map("map", {
center: [43.24226231, 76.89127236],
zoom: 17
});
myMap.controls
.remove('rulerControl')
.remove('searchControl');
myPlacemark = new ymaps.Placemark([43.24224271, 76.89130991], {
balloonContentHeader: 'Valesco',
balloonContentBody: 'ул. Шевченко 204 ТД «Саламат-1» 4-ый этаж',
balloonContentFooter: 'Это наш адрес',
hintContent: 'Это наш адрес'
});
myMap.geoObjects.add(myPlacemark);
myMap2 = new ymaps.Map("map", {
center: [51.11553962, 71.42805238],
zoom: 17
});
myMap2.controls
.remove('rulerControl')
.remove('searchControl');
myPlacemark2 = new ymaps.Placemark([51.11543833, 71.42808457], {
balloonContentHeader: 'Valesco',
balloonContentBody: 'Есильский район, улица Туркестан 8 ВП-20',
balloonContentFooter: 'Это наш адрес',
hintContent: 'Это наш адрес'
});
myMap2.geoObjects.add(myPlacemark2);
myMap3 = new ymaps.Map("map", {
center: [43.63220479, 51.17577490],
zoom: 17
});
myMap3.controls
.remove('rulerControl')
.remove('searchControl');
myPlacemark3 = new ymaps.Placemark([43.63209388, 51.17577490], {
balloonContentHeader: 'Valesco',
balloonContentBody: '1 микрорайон ТЦ СтройМарт 2 этаж, бутик “Parador”',
balloonContentFooter: 'Это наш адрес',
hintContent: 'Это наш адрес'
});
myMap3.geoObjects.add(myPlacemark3);
}
CSS прописан только для одного статического значения, поэтому нижние отступы у карты меняются
#main-contacts ymaps.ymaps-2-1-60-map:nth-child(1), #main-contacts ymaps.ymaps-2-1-60-map:nth-child(2){
margin-bottom: 119px!important;
}
Переопределять css-классы API, как в Вашем примере нельзя. Во-первых, это действительно сломается с выходом новой версии, а во-вторых, может непредсказуемо сломать что-то другое в работе карты.
В API Яндекс.Карт есть менеджер отступов. Он позволяет задать прямоугольные области в экранных координатах, которые обозначают занятые области контейнера карты.
Пример в песочнице Яндекса
Как развивать веб-проекты в 2026 году: технологии, контент E-E-A-T и факторы доверия
Современные инструменты для криптотрейдинга: как технологии помогают принимать решения
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники