Text doesn't fit in the box. CSS issue

background:url(images/page_text.png) repeat-y;  
margin: 0 auto; 
width: 949px;
padding: 20px;
line-heig开发者_开发技巧ht: 100%;

That was my css. What is wrong? When I write long sentence, it doesn't fit in the page_text.png box (It is funny, but only in IE, it works fine). I think I am missing something.

You need to set word-break... unfortunately, it's not consistent across browsers, so you use the code below to force it on all browsers. It's explained here

white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */

It seems you are talking about a long word and not a long sentence. In that case you can use:

word-wrap: break-word;

Set overflow:hidden (CSS2) to hide the overflow on browsers that don't support the word-wrap:break-word (CSS3) to force a word break in the middle of a pathologically long word.

Edit: See the test case here, with an image: http://jsfiddle.net/8dP2m/4/

Edit 2: And here it is with the image in the background: http://jsfiddle.net/8dP2m/7/

When asking for HTML/CSS help, please provide:

1. Your actual code (you followed up with this in comments, though you should edit your question to include it). A pared-down test case showing the actual problem on JSFiddle is best.
2. What you hoped to see.
3. What you see instead (making it clear how this differs from #2).
4. On what OS/browser/version you are experiencing the trouble.