Fontawesome icon prevent newline wrapping

Question

how can I prevent a newline to be inserted between a fontawesome icon and the text that is near this icon ?

See the fiddle, I have a nbsp, but it is discarded.

Answer 1

Since the text you're trying to NOT wrap is not inside any element, how would css know where to wrap or not wrap? The width of the jsfiddle .test was 20px, that is the same width (approx) of the icon, so I don't really understand. If you don't want something to wrap, here's one way of doing this, wrap what you want to not wrap inside an inline element, like a span, then add the class you want on that span.

HTML Abcdef ghijklmnopqrstuvwxyz

CSS:

.test {
    width: 100px; /*20px is too small the icon is 20px (approx) you need more space */
}

.test span {white-space:nowrap}

Demo: http://jsbin.com/rineye/2/edit