HTML+CSS: How to force div contents to stay in one line?
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.
Solution 1:
Try this:
div {
border: 1px solid black;
width: 70px;
overflow: hidden;
white-space: nowrap;
}
Solution 2:
Use white-space:nowrap
and overflow:hidden
http://jsfiddle.net/NXchy/8/
Solution 3:
in your css use white-space:nowrap;