How to permit HTML to break at specified points?

Question

I know about non-breaking spaces but I've got the opposite problem and Google doesn't even find anyone else asking the question.

I have a piece of text: <option A>/<option B>/<option C> (the number of options is variable) that I want to break only at the slashes. Keeping it from breaking elsewhere is trivial--replace the spaces with non-breaking spaces. What I'm stumped on is permitting it to break after the slashes. Do I just have to insert an extra space after the slashes even though that won't look as good?

Answer 1

You can use the <wbr> tag to allow the browser to break at the slashes:

<option A><wbr>/<wbr><option B><wbr>/<wbr><option C>

Answer 2

Use a Unicode Zero Width Space (U+200B). You can enter them directly as characters — optionA​/​optionB​/​optionC — or alternatively, since you can't really see the zero-width-spaces there, as character references: optionA​/​optionB​/​optionC.