Question

I have a div. It is really simple. Here is the CSS code below.

#example {
    background: #dcdcdc;
    background-position: center;
    postition: relative;
    width: 980px;
    text-align: center;
    margin: 0px auto;
    padding: 1px;
    min-height: 30px;
}

html code:

<div id="example">testtesttesttesttesttesttesttesttesttesttesttest</div>

As you can see it only contains text that is selected from a database table.
The problem is that when the length of the text is wider than the screen it does not start a new line, it goes over. I want to make it start a new line. How could I do that?

Note: The overflow is hidden on the page. I only tested this page in Chrome 13 and FF 3.6.

Answer 1

Word wrap will do the trick:

word-wrap: break-word;