Мой встроенный календарь Google выглядит слишком маленьким на мобильном устройстве (Iphone 13 pro) ⇐ CSS

[Anonymous]

Я добавил Календарь Google на веб-сайт своего портфолио, в браузере ПК он выглядит нормально, но когда я захожу на свой веб-сайт на Iphone 13 pro, он выглядит слишком маленьким.
CSS:

Код: Выделить всё

        /* div of big calendar */
@media (max-width: 550px) {
.big-container {
display: none;
}
}
/* div of small calendar */
@media (min-width: 550px) {
.small-container {
display: none;
}
}
/* Responsive iFrame */
.responsive-iframe-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.responsive-iframe-container iframe,
.vresponsive-iframe-container object,
.vresponsive-iframe-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* Some design to make it dark */
.small-cal, .big-cal{
filter: invert(.9) saturate(0.5) hue-rotate(145deg);
}

HTML:

Код: Выделить всё

    

Schedule a meeting





(function() {
var target = document.currentScript;
window.addEventListener('load', function() {
calendar.schedulingButton.load({
url: '******',
color: '#039BE5',
label: 'Book an appointment',
target,
});
});
})();



**


******

*****

**

На мобильных устройствах это выглядит так:


В браузере Google Chrome это выглядит так:
[img]https://i.sstatic.net /en5zDbvI.png[/img]

Как вы можете видеть на изображениях выше, контент легко увидеть на большом экране, но невозможно на маленьком экране мобильного телефона
Поначалу он был шире моего веб-сайта, поэтому я добавил элемент div с @media (минимальная ширина: 550 пикселей), чтобы он масштабировался при меньшем экране.
Я пытался увеличить размер высота iframe в команде встраивания, которую я получаю от Google, но, похоже, это не помогает, я хотел, чтобы на телефоне он был выше, чтобы люди могли видеть содержимое календаря, но это не помогает и не помогает на меньшем экране он выше.
Есть предложения, как сделать его выше на маленьком экране мобильного телефона?

Подробнее здесь: https://stackoverflow.com/questions/786 ... one-13-pro