Minimal RWD

Minimal RWD self contained maintain 16/9 ratio

Resize the browser window and notice the player maintains 16/9 ratio.

Sample RWD code:

<!-- Outer div defines maximum space the player can take -->
<div style="width: 60%;display: inline-block;position: relative;"> 
	<!--  inner pusher div defines aspect ratio: in this case 16:9 ~ 56.25% -->
	<div id="dummy" style="margin-top: 56.25%;"></div>
	<!--  the player embed target, set to take up available absolute space   -->
	<div id="kaltura-player1" style="position:absolute;top:0;left:0;left: 0;right: 0;bottom:0;border:solid thin black;">
	</div>
</div>
<script>
kWidget.embed({
	'targetId': 'kaltura-player1',
	'wid': '_{your partner id}',
	'uiconf_id' : '{your player uiconf id}',
	'entry_id' : '{your content entry id}'
});
</script>

Example of non-hover controls correction ( bottom:-36px; )

Sample RWD code:

<!-- Outer div defines maximum space the player can take -->
<div style="width: 60%;display: inline-block;position: relative;"> 
	<!--  inner pusher div defines aspect ratio: in this case 16:9 ~ 56.25% -->
	<div id="dummy" style="margin-top: 56.25%;"></div>
	<!--  the player embed target, set to take up available absolute space   -->
	<div id="kaltura-player1" style="position:absolute;top:0;left:0;left: 0;right: 0;bottom:-36px;border:solid thin black;">
	</div>
</div>
<script>
kWidget.embed({
	'targetId': 'kaltura-player1',
	'wid': '_{your partner id}',
	'uiconf_id' : '{your player uiconf id}',
	'entry_id' : '{your content entry id}'
});
</script>