Home » Html » HTML opposite of non-breaking space

HTML opposite of non-breaking space

Posted by: admin November 30, 2017 Leave a comment

Questions:

In my HTML I have a very long word and I’m trying to force a specific break point only when there isn’t enough room. What I need is a sort of conditional-breaking placeholder. How can I achieve this sort of thing?

Answers:

Maybe the Unicode zero-width space would help: http://www.fileformat.info/info/unicode/char/200b/index.htm

The HTML entity is e.g.
over​flow will break the word between “over” and “flow” only when the full word doesn’t fit.

Questions:
Answers:

The tag <wbr> (for Word BReak) will do what you want.

Questions:
Answers:

The Microsoft CSS rule “word-wrap:word-break” should do what you want and is supported by most older browsers

https://developer.mozilla.org/en-US/docs/CSS/word-wrap

http://msdn.microsoft.com/en-us/library/ie/ms531186(v=vs.85).aspx

There is also now a WC3 version – “overflow-wrap:break-word;” and as you can read in the spec “For legacy reasons, UAs must treat ‘word-wrap’ as an alternate name for the ‘overflow-wrap’ property, as if it were a shorthand of ‘overflow-wrap’.” – so you may want to test wether your browser set is actually implementing this.

http://www.w3.org/TR/css3-text/#overflow-wrap

http://caniuse.com/#search=overflow-wrap

You could always play it safe and use both

p.breaklongwords {
    word-wrap:word-break;
    overflow-wrap:break-word;
}