Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • March 24, 2016 at 4:40 pm #603223
    htm2112

    How can I remove the black bars on the Vimeo videos in my site? As an example, have a look at http://hoverprotech.com/videosnews/ and http://hoverprotech.com/3914b-baxter-drive/. They are especially prevalent when viewed on a mobile device.

    March 24, 2016 at 4:49 pm #603232
    Yigit

    Hey htm2112!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    .embed-vimeo iframe {
    height: 450px;
}

    Cheers!
    Yigit

    March 25, 2016 at 4:05 am #603533
    htm2112

    Thanks for your help. That sort of works. If the video is viewed on a mobile device or if the webpage is resized, the black bars move around because the container is not responsive.

    How can the vimeo container be made responsive so that the black bars never appear?

    March 25, 2016 at 4:20 am #603537
    htm2112

    I was able to resolve the problem by adding the following to my css.

    .embed-vimeo { 	height: 0; padding-top: 25px; padding-bottom: 54.5%; margin-bottom: 10px; position: relative; overflow: hidden; }
.embed-vimeo iframe { top: 0; left: 0; width: 100%; height: 100%; position: absolute; }
    March 25, 2016 at 10:06 am #603605
    Basilis

    Hey!

    Happy we could help you out.
    Btw, If you have a moment, I would very much appreciate if you could quickly rate our theme, which wiII heIp us keep the deveIopment.

    We really appreciate your feedback and input and again, thanks a lot for using our theme!
    Regards,
    Basilis

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Black Bars on Vimeo Videos’ is closed to new replies.