When you publish non-responsive projects like the one you have here, it will display at the resolution you set it for when you created it. This is fine for desktop computers but if someone was going to view it on a tablet or smartphone it will mean they will have to scroll around the page to see all your content.
The solution is, when you publish check off Scalable HTML content. See the screen shot below.
Publish To My Computer Window
This will resize your eLearning to fit within the browser viewport of whatever device you are viewing. Of course there are several drawbacks.
- Text might get very small on the screen
- Since your eLearning project uses a fixed aspect ratio, the users might see some black bars above and below or on either side of your stage.
To help with the first point, I would recommend that you test it out on a typical device and up the font size where necessary. It might be too large when viewed on a computer but might be just right on a smartphone or tablet.
Now for item 2, you can select the colour of the area around your stage. It’s located on the same screen where you selected the border around your project (Shift+F11). See below.
