Hi! I'm trying to get the answer options on a question to stop breaking up words at the end of lines with hyphens. I'd prefer the entire word carries over to the next line. I've tried adding some code I found on W3Schools in the CSS editor in "Look and Feel," and I've also tried editing the question JavaScript, but nothing is working for me. I am probably doing the coding incorrectly, but I don't know what to change. Help!
Solved
How to stop auto-hyphenation
Best answer by Tom_1842
Thank you for providing the screen shot! I played around with it some on my end and here is what I found:
The auto hyphenating only appears for me when all of the following are true:
- Modern or Flat layout is used (Classic does not get autoheypenated)
- Rank Order question type that use Drag and Drop (Radio buttons, text box, and select box do not get autohyphenated)
- The screen width is not large enough and causes the question answer container to be resized (such as on Mobile devices)
My various attempts to prevent this with CSS also did not work, so I think the simplest solution is to use the Classic layout if you can. Changing the question type a different Rank Order or to some kind of rating scale (Multiple Choice or Matrix) would also work.
+28Hi there, have you tried using the non-breaking hyphen yet? Try adding this in the Source View of the Rich Content Editor to your question:
‑
https://en.wikipedia.org/wiki/Wikipedia:Non-breaking_hyphen
Hi Tom, thanks for replying! I should have worded my question differently... it's breaking up words like "alignment" and "describes" - words that aren't hyphenated, but they're not fitting on the line, so the survey is automatically inserting a hyphen where I don't want one instead of just putting that full word on the next line.
+28Ah, I am not sure I've run into that before. Any chance you can post a QSF or a screen shot so it might be investigated further?
Here's one of the question answer choices (sorry for the blacked out bits... I'm not sure what I'm allowed to share publicly, as this is an internal survey). It's a rank order question with 6 other choices, most of which have similar issues with the unwanted hyphenating.
This is one of the references I was trying to use - https://www.w3schools.com/cssref/css3_pr_hyphens.asp
Theoretically, the first one should prevent it from adding hyphens, but I couldn't get it to work. I am more than likely just doing something wrong with the code, but my coding knowledge is so limited I don't even know what it is that I'm doing wrong.
+28Thank you for providing the screen shot! I played around with it some on my end and here is what I found:
The auto hyphenating only appears for me when all of the following are true:
- Modern or Flat layout is used (Classic does not get autoheypenated)
- Rank Order question type that use Drag and Drop (Radio buttons, text box, and select box do not get autohyphenated)
- The screen width is not large enough and causes the question answer container to be resized (such as on Mobile devices)
My various attempts to prevent this with CSS also did not work, so I think the simplest solution is to use the Classic layout if you can. Changing the question type a different Rank Order or to some kind of rating scale (Multiple Choice or Matrix) would also work.
Yeah, using Classic layout fixed it! So strange that problem only occurs under certain circumstances... thank you so much for your help!!
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.