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

Question

My css for Iframe:

position: absolute;
right: 0;
top: -100px;
z-index: 1;
height: 110%;
width: 100%;
border: none;
overflow-y: auto;
overflow-x: hidden;

Это мой CSS экран iframe на моем веб-сайте, но на мобильных устройствах мне нужно прокручивать экран Iframe, чтобы увидеть веб-сайт полностью. Примечание. Я не в силах сделать iframe отзывчивым.

Answer 1

Метод bootstrap. Используйте в нем элемент iframe или видео.

<div class="embed-16by9">
  <iframe src="..."></iframe>
</div>

с отзывчивым css

embed-16by9 {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
}
.embed-16by9::before {
  display: block;
  content: "";
  padding-top: 56.25%; /* ratio 16:9 */
}
.embed-16by9 iframe,
.embed-16by9 video {
  width: 100%;
  border: 0;
  position: absolute;
  top: 0; bottom: 0; left: 0;
  height: 100%;
}