JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<div id="map"></div>

CSS

#map {
    width: 100%;
    height: 400px;
}

JavaScript

ymaps.ready(function () {
    var myMap = new ymaps.Map('map', {
        center: [55.084080,38.800142],
        zoom: 10
    });
    
    
    var myPlacemark = new ymaps.Placemark([55.084080,38.800142], {
        iconContent: '1', 
        balloonContentHeader: 'Студия дизайна "Kolomna-WEB"', 
        balloonContentBody: ' <a href="page.php?id=1081"><button class="but_ball">Подробнее</button></a>', 
        balloonContentFooter: '[email protected]', 
        hintContent: 'Студия дизайна "Kolomna-WEB"'
    }, {
        iconLayout: 'default#image', 
        iconImageHref: "http://api.yandex.ru/maps/jsbox/2.1/examples/maps/ru/icon_customImage/images/myIcon.gif", 
        iconImageSize: [30, 42], 
        iconImageOffset: [-3, -42]
    }); 
    
    myMap.geoObjects.add(myPlacemark);
});