Question

I’m using white-space:nowrap; to keep my text in one line. But the text is long and goes beyond the element. How to wrap the text exactly to the width of an element?

To understand more clearly what I mean, see this JSfiddle.

Update: another JSfiddle to show more clearly what I need.

Answer 1

AS long as you’ve set the width of the element, just take the whitespace:no-wrap off, and it will wrap the text exactly to the width of the element.

edit

OK — here’s what you need:

div {
  background-color:#FF00FF;
  width:200px;
  overflow:hidden;
  height:1em;
}