Kein Zeilenumbruch im <li> Element

[Mief]

Hallo Leute,
ich hab da ein gas kleines Problem. Da Google mir net geholfen hat, frag ich jetzt euch:

Ich habe eine Liste in einem div-Element. Dieses div hat eine Standartbreite von 330px. Die Liste hat neben den normalen Punkten auch noch Unterpunkte und Unterunterpunkte. Jetzt ist die Liste natürlich irgendwann breiter als das div. Nach meinem aktuellen Stand fabriziert mir mein Browser da ein paar Zeilenumbrüche in den Listenpunkt. Mit welcher CSS-Regel (oder sonst irgendwas) lasse ich die Zeilenumbrüche verschwinden? (Die Punkte sollen dann einfach abgeschnitten werden.)
Hoffentlich hab ich das so erklärt, dass ihr das versteht. Danke schonmal.

[Mief]

Hier nochal mein HTML-Code:

<nav id="nav">  
            <div id="navigation">  
                <ul id="nav_list">  
                    <li class="folder">icons  
                        <ul>  
                            <li class="file">new_document.png</li>  
                            <li class="file">new_document-klein.png</li>  
                            <li class="file">save_document.png</li>  
                            <li class="file">save_document-klein.png</li>  
                            <li class="file">open_document.png</li>  
                            <li class="file">open_document-klein.png</li>  
                        </ul>  
                    </li>  
                    <li class="folder">scripts  
                        <ul>  
                            <li class="file">ie-css3.htc</li>  
                            <li class="file">jquery-1.10.2.min.js</li>  
                        </ul>  
                    </li>  
                    <li class="folder">styles  
                        <ul>  
                            <li class="file">footer.css</li>  
                            <li class="file">header.css</li>  
                            <li class="file">iframe.css</li>  
                            <li class="folder">Testpunkt  
                                <ul>  
                                    <li class="file">Testpunkt 1</li>  
                                    <li class="file">Testpunkt 2</li>  
                                    <li class="file">Testpunkt 3 und das geht hier noch ganz lange so weiter und hoffentlich gibt es hier einen Scrollbalken und keinen Zeilenumbruch.</li>  
                                </ul>  
                            </li>  
                            <li class="file">index.css</li>  
                            <li class="file">main.css</li>  
                            <li class="folder:empty">nav.css</li>  
                            <li class="file">normalizer.css</li>  
                        </ul>  
                    </li>  
                    <li class="file">vorlage.css</li>  
                </ul>  
            </div>  
        </nav>

Und hier ma der ganze CSS-Code:

#nav {  
    box-sizing: border-box;  
  
    width:330px;  
    background-color: #c0c0c0;  
    float:left;  
  
    position: absolute;  
    top:80px;  
    left:0;  
  
    padding: 10px;  
}  
#navigation{  
    background-color: #ffffff;  
    box-shadow: 0px 0px 20px 5px #9d9d9d;  
    -webkit-box-shadow: 0px 0px 20px 5px #9d9d9d;  
    -moz-box-shadow: 0px 0px 20px 5px #9d9d9d;  
    margin:0;  
    overflow: scroll;  
}  
#navigation ul{  
    margin: 0;  
    padding: 0;  
}  
#navigation li{  
    list-style: none;  
    margin-left: 30px;  
}  
#navigation img{  
    margin-right: 4px;  
}  
#nav_list ul{  
    display: none;  
}

[Gunnar Bittersmann]

@@Mief:

nuqneH

Mit welcher CSS-Regel (oder sonst irgendwas) lasse ich die Zeilenumbrüche verschwinden?

white-space und overflow, sinnvoll ergänzt durch text-overflow. http://bittersmann.de/articles/ellipsis/

Qapla'

[Mief]

white-space und overflow, sinnvoll ergänzt durch text-overflow.

white-space:nowrap hat geholfen, overflow hate ich schon. Danke für die schnelle Hilfe!!!