[html/css] Forcing items to stay on same line

Question

This should be fairly simple, but I have not been able to find anything usefull when google-ing.
What I have is some text and some icons that I want to ensure that stays on the same line. For example I want this:

Text goes here and eventually we run into the end of the line [text][icon]

or this:

Text goes here and eventually we run into the end of the line 
[text][icon]

but not this:

Text goes here and eventually we run into the end of the line [text]
[icon]

The only thing I've been able to come up with when google-ing is that apparently IE has some problems implementing this. I don't really care if IE is able to do it or not (at least not yet), I just want to find a solution... :)

Answer 1

Put it in a container with no-wrap specified for the whitespace property in the stylesheet.

Answer 2

Consider using the non-breaking space   instead of space between the last word(s) and the icon.

For example:

Text goes here and eventually we run into the end of the line [text] [icon]

instead of

Text goes here and eventually we run into the end of the line [text] [icon]

Answer 3

You need to use non-breaking spaces, coded   to prevent breaks in the spaces between.