CSS way to restrict line break for text

I have maybe a little bit strange task, but I belive there is no better solution. I need to have `<ul>` in some container which width is changeable and with inlined `<li>` elements of fixed width. I should (and already found solution) put spaces between `<li>` elems of same width. Width of spaces is changes dynamicaly and depends of parental container width. Again, this `<li>` items have fixed width. I also should place some links above this described elements. For some reasons links must be in other `<ul>` element. They also wrapped in inlined `<li>` elems. And I want them to be positioned right above described `<li>` items. This can be done by setting fixed width of `<li>` items as above. Now, the problem is that text in every link is actualy have different width and will break into two lines, but I must place it into one line. So I want to trick browser: text will be overflowing `<li>` items. ``` .liElem { width: 100px; height: 20px; overflow: visible; } ``` But, as you may guess, text is breaking into two lines and overflowing actually the bottom of list items, not the right side. The effect I wanted can be done by inserting `&nbsp;` insted of spaces in text like this: `<li><a href="#">Add&nbsp;to&nbsp;Favourites</a></li>` . So, my question is this: how in css-way make usual text NOT to break into several lines ?