Support » Fixing WordPress » setting iframe tag to span the size of the window (responsively)

  • [ redundant link removed ]
    The only thing on this entire page is a code block containing:

    <iframe width=”100%” height=”750″ src=”https://cdn.instavr.co/html/IjpTluA76SLIWVFZmVg9_app.html?bust=fl8xzk4do5&#8243; frameborder=”0″ allowfullscreen></iframe>

    I have tried multiple methods including entering the width=”100vw” and height=”100vh” but I can’t seem to get the URL to embed properly (and responsively to work well across web an mobile)

    Do I need to use some sort of addition CSS? Are there other width and height values that I am unaware of? I also want to get rid of those double scrolling bars that appear on the right side with the iframe tag, but getting it to span the entire screen is more important right now.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
    where it says that the width and height attributes are like any other, and just take a number which is pixels.
    As it says, you can try CSS object-fit, but it might not work in all browsers.
    You can use a small javascript to adjust the size when the window is resized or screen rotated.

    You can try to put the width and height in CSS, but I don’t think it works.

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.