CSS: limit element to 1 line
Solution 1:
It is possible:
element (white-space: nowrap; overflow: scroll;)
Text parsed as HTML or XML is tokenized, which means all runs of whitespace are collapsed to a single space character. This means you will have a single line of text unless you specify something in addition to the overflow declaration that could cause your text to wrap.
EDIT: I failed to include the necessary write-space: nowrap property, otherwise the default is that a container will scroll vertically opposed to horizontally.
Solution 2:
use display block so it won't go beyond your parent element.
p#foo{
white-space: nowrap;
overflow: hidden;
display: block;
text-overflow: ellipsis;
}
Solution 3:
p#foo {
white-space:nowrap;
overflow:hidden;
}
Solution 4:
If you are looking to disable text wrapping, use white-space: nowrap;
.