Scroll bars appearing with Accessible Text when text boxes are set to Resize Shape to Fit Text

Mar 11, 2021

I have a project in which I have set Accessible Text to be switched on by default (by setting the default value of Player.AccessibleText to True). When I preview or publish the slides some (but not all) textboxes set to 'Resize shape to fit text' have scrollbars. See attached screenshot.

I understand that the scrollbars will appear if the learner resizes text using Helperbird or similar, but I don't think they should display when the font has not been changed? Is this a bug? It means I will have to go through my project and change the properties of all affected text boxes from 'Resize shape to fit text' to 'Do not auto-fit' and make them a bit bigger. Groan. Or maybe I'm doing something wrong?

15 Replies
Becca Levan

Hello Gillian!

I peeked at Dayn's support case, and it appears there was some possible file corruption. 

Importing the slides into a new blank Storyline file did the trick. If you still experience issues after an import, try a quick repair as the next step.

We're only a click away if you need further troubleshooting support!

Jennifer Wheeler

Are there any specs to creating text boxes or objects to "accessible text" toggled on? It seems that this toggle moves text boxes down 2-3 pixels randomly and creates scroll bars randomly. I have just looked at the preview version to see the scrollbars. It seems it is providing a specific amount of space after text--I just can't figure out what it is and have no guidance on how to design the screen so it looks the same if this feature is toggled on or off.

Leslie McKerchie

Hi Jennifer,

Thanks for reaching out and sharing what you are experiencing. We do not have recommended specs, but you'd want to ensure that the bounding box can accommodate the text.

The accessible text is HTML text, and different browsers treat HTML text differently. As a result, there may be variations in line and character spacing across browsers even when learners don't change text properties.

Since some browsers add more spacing than others, you might see an unexpected scroll bar in some text boxes, such as slide titles. This happens when the text plus spacing is bigger than the bounding box. If you want to avoid scroll bars in default accessible text, you can increase the height of the text box to account for differences in spacing across browsers.

Storyline 360: Accessible Text

If you'd like our team to look at your project, please share your .story file privately by uploading it here. It will be deleted when troubleshooting is complete.

Brian Daigle

I'm having the same issue. I found this nice article that helped me understand what toggling Accessible Text on and off is actually doing and why it looks different - https://access.articulate.com/support/article/Storyline-360-Accessible-Text 

But it doesn't address the issue I'm seeing, which is that despite the fact the text box is set to Expand Height to Autofit, it's adding scrollbars instead. The solution of "make the box big enough to accommodate shifts in the text" isn't a helpful answer because I'm not setting the the size of the box, Storyline is automatically expanding the size of the box through the Autofit > Expand Height option. 

Jose Tansengco

Hi Brian, 

The article that you shared also goes on to explain why you're seeing the scrollbars for your text boxes.

Since some browsers add more spacing than others, you might see an unexpected scroll bar in some text boxes, such as slide titles. This happens when the text plus its spacing are bigger than the bounding box. If you want to avoid scroll bars in default accessible text, you can increase the height of the text box to account for differences in spacing across browsers.

If you'd be willing to share a copy of your project file here or in private by opening a support case, I'll be glad to test if increasing the size of the text boxes in your project will work to remove the scrollbars across all major browsers. 

Brian Daigle

Thanks Jose, I did have to increase the size of boxes to eliminate the scroll bars, but this seems like kind of a bug because I had set the boxes to "Expand Height" automatically to fit the text. I wanted this setting to prevent the scroll bars from appearing by expanding the height of the box automatically - it seems like that's what it should do. However, it appears that option only expands the height in the development space and then that height gets locked in when it's published? Multiple testers saw the scrollbars and I don't think any of them had custom display settings in their browser, so that's just the default view. Therefore, it doesn't seem like I can use that option and still publish a project without the risk scrollbars appearing with accessible text. I can't, for example, tell it to overflow the textbox rather than add scrollbars, because those options aren't available because the box is already set to expand to fit.

So my solution is to just not use the "Expand Height" option for text boxes, which is a shame because that's generally the option I'd like to use. I'd love for the boxes to either expand height to fit the text when users are viewing it, or if the expand to fit only applies in the development file but the size is locked in when users view it, I'd love to have options for what happens if it doesn't fit (i.e. overflow, scrollbars, shrink to fit).

I already adjusted all the boxes in the project so I don't have the file as it was and when I reset the boxes to re-introduce the problem I was having trouble getting it to reappear because it's only showing up intermittently (which is also strange because all the text boxes have the same setting). But I don't trust that the problem is eliminated. I've attached a screenshot from an earlier Review link. Each bullet is a separate text box to appear in sync with the voiceover. They all have the same settings, but one of them gets this little scrollbar because one of the words got pushed to the next line and the box didn't expand to fit. I know if the box expanded that would create other layout problems, but I could work with that.