What's the opposite of a nbsp?

Question

A   character is a space which doesn't allow for line breaking.

<p>lorem ipsum here&nbsp;are&nbsp;some&nbsp;words and so on</p>

| lorem ipsum                |
| here are some words and so |
| on                         |

What's the opposite of that? That is, a character which is NOT rendered as a space, but CAN be used for line breaking.

<p>foo supercalifragilisticexpialidocious bar</p>
<!--   put char here ^   and here ^ -->

|foo supercalifragi |
|listicexpiali      |
|docious bar        |

or with wider size:

|foo supercalifragilisticexpiali   |
|docious bar                       |

I'm aware of the soft-hyphen character, but for my purposes, I specifically do not want a hyphen added at the break.

Sartain

Answer 1

You want the unicode character ZERO-WIDTH SPACE (\u200B).

You can get it in HTML with ​ or ​.

Explicit breaks and non-breaks:

LB7 : Do not break before spaces or zero width space.
LB8 : Break before any character following a zero-width space, even if one or more spaces intervene.
http://unicode.org/reports/tr14/

Minerva

I tested this, it does not produce a line break in Firefox 3.5.7. – Westphalia

It's not meant to produce an explicit linebreak. It's meant to indicate a point where the line can be wrapped if it's too long to fit in wherever it's supposed to go. – Minerva

So.... this character can be evil because if you copy content around that contains it (in unicode-aware editors that will happily play along) you will be unaware of its presence, and it will cause e.g. compilers to choke on it. hard. For example Chrome will tell you "ILLEGAL CHARACTER" but not point out to you where it is. I'd use this admittedly neat trick as a very last resort – Recombination

It should be called a "Non Space Break" – Indeciduous

It's visible alternative is a Hyphen. – Obovoid

Answer 2

There also is the little-known wbr tag, which lets the browser to decide whether to break the line or not.

Justificatory

It should be noted that this is non-standard, and not supported in all browsers. – Saying

@Brian, check the quirksmode link fredden posted. – Sartain

If it's good enough for Facebook, it's good enough for every one ;-) – Ironwood

WBR works in Chrome 34.0.1847.131 m, Firefox 29.0.1, and Opera Chromium 12.17. It does not work in IE 11.0.9600.17105. – Infallible

does <wbr> add an - ? – Fanfani

@Fanfani You may want to have a look at ­ – Dasi

Answer 3

There's a nice page over at quirksmode.org that answers this question quite nicely IMHO. http://www.quirksmode.org/oddsandends/wbr.html

In short: use <wbr /> or &#8203; (or &shy; but you mentioned you don't want the dash).

Selfregard

Not all of these possibilities are supported by all browsers. I guess &#8203; is the best solution as most browsers should be able to recognize Unicode. – Necropsy

and IE6 users get an ugly glyph apparently... my heart weeps. – Sartain

Answer 4

use <wbr>.

Biodynamics

Answer 5

You can use CSS3 property called word-wrap

p.test {word-wrap:break-word;}

Hope it helps!

Diminutive

This works only if you don't care where the line break is added. – Proof

The question is to set a position in a specific word where to break, not how to enable work break in general. – Fetish

Answer 6

theres a lot of discussion about this but it has become more or less standard to use ­

Ami

This is a soft hyphen, which the asker didn't want. – Riproaring