The problem, as you can see, is that the movies are ridiculously large. This is the only collection that is displaying this way-we have other movies loaded that are showing at the size we’d expect. We are using the HTML 5 media display plugin, and when we deactivate the responsive sizing option, the video displays normally. What gives?
Not entirely sure, but it might help to check whether the problem is also there with other themes (it looks like you’ve put some work into a custom theme?). That might help us diagnose the problem.
I believe the problem is the .gvsu_only_file style which sets the div the player is contained in to width: auto. The “responsive” mode works by setting a very large width for the player but also setting a max-width of 100%. The idea is to make the player always take up as much space as is available or can be available, but no more.
If the outer container has a width of auto, though, this falls apart, as it will grow to fit the huge theoretical dimensions of the player and you get a laughably huge video as you’re seeing here.
Changing the .gvsu_only_file style to width: 100% should stop this from happening.
This has at least partially solved the problem-the videos now don’t extend beyond the width of the screen (you can see for yourself). They are, however, displaying at a much larger size than they do when played from the desktop, which is a bit puzzling, since we aren’t having the problem with our other video collections. Thanks!
Do you have an example link for a video not showing this problem?
The “responsive” option just tells the video to take up all the space, so that can obviously get pretty big. You can restrain it by having a container of some specified width (either specific pixel dimensions or some percentage of the amount available).
The simple answer if you have a particular size you want is to just set that in the plugin settings and turn off responsive mode.