Force word wrap through CSS

Question

At the moment TEST TEST appear side by side. How can I push one down onto a second line? Only through CSS.

TEST TEST
         


        
      

Answer 1

Assuming you're trying to make the element always show one word in a line, you can use the CSS word-spacing property.

jsFiddle Demo

#box {
    word-spacing: 30000px; 
}

---

• P.S - You can set this property to a very large value (32767px on Chrome 29.0.1 and infinite values on FF23) and it'll work the same way. That way it won't be coupled with the container's width.