Heading text (sourcing from collection) won't line break on mobile view?

Design help General
1

Hi,

I have a simple open/close dropdown which I’ve used loads of times.
This is a basic FAQ question/answer function. However the questions are long and on mobile view, they simply refuse to break to a new line. Instead they keep flowing horizontally behind the screen. The heading is sourcing from a CMS collection. Is this a bug in Webflow? I’ve never seen this before and I’m not using any class to cause it to behave this way.
Any ideas?

https://preview.webflow.com/preview/mobilelinebreak?utm_medium=preview_link&utm_source=designer&utm_content=mobilelinebreak&preview=b1e34a9621b09f2c5426082aadf09cae&workflow=preview

2

There is a style applied on Dropdown Toggle, that doesn’t let the text break.

Screen Shot 2022-01-27 at 11.03.37 PM
Screen Shot 2022-01-27 at 11.03.37 PM1920×1401 198 KB

So either remove that or you can apply Breaking = Normal from Webflow’s panel.

Check the screenshot.

Screen Shot 2022-01-27 at 11.09.22 PM
Screen Shot 2022-01-27 at 11.09.22 PM3034×1828 387 KB

3

Hey, thanks for this. This has to be a bug in Webflow so as there is no class on this Dropdown Toggle. i.e. this is default Webflow styling. Even though by default it was set to ‘Breaking: Normal’ I had to actually set this style for it to properly break on mobile.