JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://api-maps.yandex.ru/2.1-dev/?lang=ru-RU"></script>
<div id=size_menu>
    <a href=# id=small>small</a>
    <a href=# id=meduim>meduim</a>
    <a href=# id=large>large</a>
</div>
<div id=map class=small></div>

CSS

html, body {
    margin: 0;
    padding: 0;
}

.small {
    width: 320px;
    height: 480px;
}

.meduim {
    width: 700px;
    height: 700px;
}

.large {
    width: 1280px;
    height: 960px;
}


#size_menu {
    margin-bottom: 20px;    
}

#size_menu a {
    color: red;
    padding: 4px 3px;
}

JavaScript

// Подробнее http://api.yandex.ru/maps/
ymaps.ready(function () {
    var map = new ymaps.Map('map', {
        center: [53.90473, 27.551899],
        zoom: 10
    });
    
    var smallElement = document.getElementById('small'),
        meduimElement = document.getElementById('meduim'),
        largeElement = document.getElementById('large'),
        mapElement = document.getElementById('map');
    
    smallElement.onclick = function () {
        mapElement.className = 'small';
        fitMapToViewport();
    };
    
    meduimElement.onclick = function () {
        mapElement.className = 'meduim';
        fitMapToViewport();
    };
    
    largeElement.onclick = function () {
        mapElement.className = 'large';
        fitMapToViewport();
    };
    
    function fitMapToViewport () {
        // Вызываем перерасчет размеров контейнера карты.
        // Это может происходить автоматически при помощи опции autoFitToViewport
        // http://api.yandex.ru/maps/doc/jsapi/beta/ref/reference/Map.xml#param-options.autoFitToViewport    
        map.container.fitToViewport();
    }
});