Storyline and Studio: How to Avoid Scrollbars and Margins in Web Objects

Article Last Updated January 24, 2024

When the HTML content in a web object is larger than the web object itself, your published content will have scrollbars and unnecessary margins. We recommend making your HTML content no larger than the space you've given the web object in Storyline, Presenter, or Quizmaker.

You may be able to suppress scrollbars and unwanted margins in local web objects by setting the margins to 0 and overflow to hidden in the web object's index.html file, as shown below.

<html>
<head>
<style>
html, body {
margin: 0 0 0 0;
overflow:hidden;
}
</style>
</head>
<body>
This is where your html content appears.
</body>
</html>

Add the <style></style> tags and everything between them, as shown above, to your web object's index.html file. And make sure your file also has <head></head> tags.