HTML+CSS: How to force div contents to stay in one line?

Question

I have a long text inside a div with defined width:

HTML:

<div>Stack Overflow is the BEST !!!</div>

CSS:

div {
    border: 1px solid black;
    width: 70px;
}

How could I force the string to stay in one line (i.e. to be cut in the middle of "Overflow") ?

I tried to use overflow: hidden, but it didn't help.

Answer 1

Try this:

div {
    border: 1px solid black;
    width: 70px;
    overflow: hidden;
    white-space: nowrap;
}