SL360: max-width, max-height

Jan 22, 2020

Hi there,

since the new version (January 22 2020) it is no longer possible to define the max-height and max-with of a published course (bevor you could alter the style for #preso in main.min.css, and everythings worked fine). Is there anyone out there, who knows about  a workaround?


I found a workaround: jquery.

put the jquery.js into the directory html5/lib/scripts/

insert a new html-page (index.html) in the base directory of the course. Alter the imsmanifest.xml: change

<resource identifier="__6J5hCikf93B_course_id_RES" type="webcontent" href="index_lms.html" adlcp:scormtype="sco">


<resource identifier="__6J5hCikf93B_course_id_RES" type="webcontent" href="index.html" adlcp:scormtype="sco">

Add this to the Head of index.html:

<script type="text/javascript" src="html5/lib/scripts/jquery.js"></script>
<script type="text/javascript">
function sizeContent(){
var x = $(window).width();
if(x< 1185){
$('.myInner').css('width', $(window).width()+'px');
$('.myInner').css('height', $(window).height()+'px');}
$('.myInner').css('width', 1185+'px');
$('.myInner').css('height', 874+'px');
var y = Math.trunc(((x - 1185)/2));
$('#inner').css('margin-left', y +'px');


<style type="text/css">

margin: 0 auto !important;


and the body:

<body style="overflow: hidden;">
<div id="inner">
<iframe src="index_lms.html" class="myInner" id='ght' frameborder="0"></iframe>
<script type="text/javascript" language="javascript">
$(document).ready(function () {


it works just fine!



Be the first to reply

This discussion is closed. You can start a new discussion or contact Articulate Support.