Moodle 2.6.2+ (Build: 20140415) - Theme=Essential
Hi,
Is there a way to have an embedded youtube video within a lesson (or any other activity) that is responsive (especially for mobile devices) yet displays as a maximum width in normal (wider) browsers?
I'm already able to make the video responsive using additional css in the theme settings (essential theme):
.video-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.video-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
This works fine when I enclose the youtube html in a div tag referring to the above css classes.
HOWEVER, I don't want the video to display at 100% width on larger screens as it just becomes too big compared to other content when the page is full screen (looks great on iPhone though).
I'd really like to be able to set a max-width of 500px
Maybe this is something really simple but nothing I've tried has worked.
Any help appreciated.
Thanks
Mike