Forum Discussion
Storyline file not fit in rise
Hello SamHill,
check this link https://360.articulate.com/review/content/b87edb7b-a69a-44ff-acf1-24a6f2c01223/review
I tried something:
The class blocks-storyline__item has a padding-bottom of 186.557%. When I reduce this size, it works, and the size becomes smaller. I tested it, and it works.
However, I am unable to find this class in the main HTML file. I think it is coming from an external file, and I can't locate it. So, I added the following code to the main HTML file.
<style>
.blocks-storyline__item {
padding-bottom: 78% !important;
}
</style>
check here padding-bottom
so after reducing padding its look like below:
It is working fine, but I am not sure if it is the correct approach. Could you please check and let me know whether it is the right way or not?
Hi mayur try this out instead. Again, just paste these classes in just before the closing </head> tag in the HTML page. I've only add the !important declaration to padding-bottom as that style is added by script directly to the node, and so we need to override it with the !important declaration, otherwise, the rest should be ok as they are declared after the CSS is loaded and so should override the existing styles.
BUG There is a bug, but likely not to be seen by users, as you'd need a screen size larger than ~1700px to see it. The green background continues to grow beyond the maximum height of the embedded Storyline file.
.blocks-storyline__item
{
display: flex;
height: 100vh;
padding-bottom: unset !important;
}
.blocks-storyline__item__iframe {
height: auto;
max-height: calc(100vh - 20px);
aspect-ratio: 1 / 2;
}
SamHill,
Thank you for your response. I will check and let you know.
