Span splits, how to avoid that?

Here is the problem: http://js开发者_如何学Pythonfiddle.net/STG22/3/

I want that span would not split in two different rows (like third did in the example above). How can I do it?

---

CSS:

span
{
    background: red;
    border-radius: 5px;
    width: 60px;
}

HTML:

<div style="width: 250px">
    <span>omg omg omg</span>
    <span>omg omg omg</span>
    <span>omg omg omg</span>
    <span>omg omg omg</span>
</div>

---

Simple CSS:

 white-space: nowrap;

Updated jsFiddle: http://jsfiddle.net/STG22/5/

Full CSS:

span
{
    background: red;
    border-radius: 5px;
    width: 60px;
    white-space:nowrap;
}

---

you can set the css property white-space to nowrap, this will suppress line breaks due to space limitations

---

Use white-space:nowrap or display:inline-block (without width set).

If you weren't aware: width doesn't affect inline elements like <span>.