00 Votes

HTML: No line break for hyphenated word

Question by Compi | 2018-02-21 at 17:31

Long lines are automatically wrapped by the browser at their end. If a word contains a hyphen, the word is separated at the hyphen and the part after the hyphen appears in the next line.

How can I change this behavior? I have a few hyphenated words that should stay together with no linebreak between them. I would like to give something like a rule or statement with HTML or CSS that these words should not be separated. Is that possible?

ReplyPositiveNegative
Avatar
1Best Answer1 Vote

If you do not want a line break after certain hyphens, you can use a non-breaking hyphen instead of the normal hyphen from your keyboard. In HTML you can add a protected hyphen with ‑ like that:

123‑456

In this example, "123" and "456" will always stay together. The representation in the browser is 123-456. The protected hyphen is displayed in the browser as if it were a "real" hyphen.

Similarly, you can also use the non-breaking space. If this character is used, no line break will be made between the corresponding words although there is a space.
2018-02-21 at 19:02

ReplyPositive Negative
Reply

Related Topics

HTML: Invisible Delimiter

Question | 1 Answer

HTML: Cross out a Word

Question | 1 Answer

Important Note

Please note: The contributions published on askingbox.com are contributions of users and should not substitute professional advice. They are not verified by independents and do not necessarily reflect the opinion of askingbox.com. Learn more.

Participate

Ask your own question or write your own article on askingbox.com. That’s how it’s done.