By Andrew on Wednesday, 29 July 2015
Posted in Technical Issues
Likes 0
Views 439
Votes 0
We get a lot of posts with embedded video, but we noticed that it does not display correctly (not fitting within width of screen) when viewed on a mobile.

Are we missing some setting or could we fix this so that the embedded video will display properly on mobile?

see attached image
Hi Andrew,

Thank you very much for reporting this issue. As from my inspection, we missed out the styling for responsive video for other editor.

You can applied this CSS code to make your video responsive, please add this code to your own Joomla template CSS stylesheet:
div#fd.eb .eb-responsive-video,
div#fd.eb .video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 25px;
height: 0;
}
div#fd.eb .eb-responsive-video > .video-container {
position: static;
padding: 0 !important;
height: auto;
}
div#fd.eb .eb-responsive-video object,
div#fd.eb .eb-responsive-video embed,
div#fd.eb .eb-responsive-video iframe,
div#fd.eb .video-container object,
div#fd.eb .video-container embed,
div#fd.eb .video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

I already pushed this fix into our repo and will be available in next minor release.

Hope this help, thank you very much
·
Wednesday, 29 July 2015 13:37
·
0 Likes
·
0 Votes
·
0 Comments
·
Awesome!!! It even works better now on desktop, video's are now displaying full width. Thank you for great support!
·
Wednesday, 29 July 2015 14:50
·
0 Likes
·
0 Votes
·
0 Comments
·
Hey Andrew,

You are most welcome.
·
Wednesday, 29 July 2015 15:27
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post