Breaking line when text is overflow containing it div

I have code like this:

<div>
    <ul>
        <li>This my text but it is too long and it is stick out from div becaue it has too many characters. And i want it text to break somewhere, beste break it in place where is blank character.</li>
    <ul>
</div>

I would like to have something looks like this done automatically:

    <div>
        <ul>
            <li>This my text but it is too long and it is stick out from div 
                becaue it has too many characters. And i want it text to break
                somewhere, beste break it in place where is blank character.
            </li>
        <ul>
    </div>

Can i do this in html and css or i need something else, maybe javascript? If i c开发者_运维问答an do this anyhow, could someone help me?

you need to give width to your li in your css file:

li
{
        width:150px;
}

or like this:

<div>
    <ul>
        <li style="width:150px;">This my text but it is too long and it is stick out from div becaue it has too many characters. And i want it text to break somewhere, beste break it in place where is blank character.</li>
    <ul>
</div>

look at this: http://jsfiddle.net/qqzaK/1/