Class for responsive styling

[jlad26]

Hi there

Your plugin is great and I will defo keep using it. One problem I had though - I was struggling to center lots of videos on the same page when in responsive mode. I can do it but the only method I could make work involved giving each one a container div and setting a max-width to correspond to the player width then using margin auto.

So to avoid having to so that I created a class to allow styling when in responsive mode. Giving this class a margin auto means the player is centered in its parent div without having to specify a max-width.

Maybe would be helpful to include this small change in a future version if there is one?

Thanks!
Jon

[stopspazzing]

Missing css code:

/* Make responsive container actually responsive */
.video-js-responsive-container{
    margin:auto;
}

I merged this into my updated version of this plugin: https://github.com/stopspazzing/video-js-for-wordpress

Let me know how well it works on your end.

[jlad26]

Thanks for the quick response!

1. Pretty new to Github so am a bit lost as to how to switch over from the zencoder to the stopspazzing version as my base. So I may end up deleting this repo and starting again.
2. When I tried the stopspazzing version I get an error on activation. Will try to get that fixed and come back to you on it.
3. Great that you've added the class. Actually my preference would be to leave out the CSS margin: auto. That way users can just apply their own styling depending on circumstance. Sometimes I want the div centered, sometimes I don't. I'm sure it can be done either way but it just seems cleaner to have the "default" as no centering and users can add margin auto to the 'video-js-responsive-container' if they want to in their own childe theme stylesheets.

Cheers
Jon