making youtube video responsive

Home Forums WordPress Themes – Premium Encase Pro making youtube video responsive

This topic contains 5 replies, has 2 voices, and was last updated by  Bidur 9 months, 4 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #60752

    Gary Pfeffer
    Participant

    Hi. In live composer I put a video on the top of my blog entry using this code:

    It doesn’t get smaller on small screens, obviously. How can I make it resize to smaller screens, and still look like it does right now in regular desktop browsers?

    The page is: https://www.garypfeffer.net/let-me-share-my-new-project-432-hz-tuned-sound-healing/

    Thanks

    Attachments:
    You must be logged in to view attached files.
    #60770

    Bidur
    Moderator

    Hello Gary,

    Please add the following css inside the additional css section of your customizer and let us know;

    iframe {
        max-width: 100%;
    }

    Thanks!
    Bidur

    #60792

    Gary Pfeffer
    Participant

    When you say, the customizer, I am not sure where you mean.

    #60793

    Gary Pfeffer
    Participant

    I tried this in Appearance, Customize. It centered the video on the page on the iphone, but it did not adjust the width or height.

    #60796

    Gary Pfeffer
    Participant

    Here is the code that I have in the html/shortcode box….

    I know that the width and height are restrictive. But, if I try to use 100% for width, it doesn’t alter the height. And, if I specify a height of 100% nothing happens. It is as if I typed nothing. It isn’t honoring the % symbol in the height tag.

    • This reply was modified 9 months, 4 weeks ago by  Gary Pfeffer.
    #60807

    Bidur
    Moderator

    Hello Gary,

    Yes inside Appearance>>Customize>>Additional css, please add the following css so that that you can adjust the height manually in mobile devices;

    @media screen and (max-width: 460px){
        iframe {
            max-width: 100%;
            height: 227px;
        }
    }

    You may change the height value of your own.
    Hope it works for you.

    Thanks!

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.