Responsive videos in articles



  • Karen D Snyder
    Community Moderator

    We were able to make the videos responsive with some custom coding, following the information from Wes Drury in

    As the information from Wes states, we edited the code of the article, to enclose the <iframe> element with the link to the video, inside a <div> element with class "embed-container". Then we added the following CSS in style.css:

    .embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;

    .embed-container iframe, .embed-container object, .embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    The above made our embedded videos responsive for smaller screens.

  • Luke Hutchings

    Thank you very much! We are all set! 


Please sign in to leave a comment.

Powered by Zendesk