[CSS] Zeilenumbruch verhindern

[exception]

Hallo Leute,
komme gerade nicht weiter.

Folgender CSS-Code:

.sideBox {
    width: 230px;
    height: auto;
    border-bottom: 6px solid #7109aa;
    border-top: 3px solid #252121;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
    background: #131111;
    font-family: courier;
    font-size: 13px;
    color: #FFF;
    margin-top: 30px;
}

.boxTitle {
    font-family: trebuchet ms;
    font-size: 15px;
    font-weight: bold;
} 

HTML:

<div class="boxTitle">&raquo; Letzte Themen im Forum</div>
         <hr style="border: 1px solid #252121; margin-bottom: 13px;" />        
        
         &bull; Threadtitel1337<br>
         &bull; Langer Threadtitel soll nicht breaken<br>
         &bull; Threadtitel1337<br>
         &bull; Langer Threadtitel soll..<br>
         &bull; Threadtitel1337
</div> 

Hier der Link dazu: tripping society

Es geht um die untere Box!

Ich bekomm's gerade irgendwie nicht hin, das bei längeren Thread-Titeln ein Zeilenumbruch verhindert wird
und der Text stattdessen einfach in den nicht sichtbaren Bereich der DIV weitergeht.

Mein Idee wäre ja das jeder Thread-Titel eine eigene div/span mit width 100% bekommt. Ich bilde mir
ein das es da irgendeine Eigenschaft gab damit der Text wie von mir gewünscht in's nicht sichtbare
weitergeh anstatt einen Zeilen umbruch zu erzeugen, oder irre ich mirch da?

Ich hoffe ihr versteht was ich meine xD
Mfg da

[Snees]

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

[exception]

Hm.

        <div class="sideBox">
            <div class="boxTitle">&raquo; Letzte Themen im Forum</div>
            <hr style="border: 1px solid #252121; margin-bottom: 13px;" />        
            
            <div class="threadTitle">&bull; Threadtitel1337</div>
            <div class="threadTitle">&bull; Langer Threadtitel soll nicht breaken</div>
            <div class="threadTitle">&bull; Threadtitel1337</div>
            <div class="threadTitle">&bull; Langer Threadtitel soll..</div>
            <div class="threadTitle">&bull; Threadtitel1337</div>
    </div>


.sideBox {
    width: 230px;
    height: auto;
    border-bottom: 6px solid #7109aa;
    border-top: 3px solid #252121;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
    background: #131111;
    font-family: courier;
    font-size: 13px;
    color: #FFF;
    margin-top: 30px;
}

.boxTitle {
    font-family: trebuchet ms;
    font-size: 15px;
    font-weight: bold;
}

.threadTitle {
    position: relative;
    width: 225px;
    height: 13px;
    background: #131111;
    margin-bottom: 2px;
} 

Mit der extra Klasse funktioniert es zwar so wie ich will, aber irgendwie ist das ganze ein bisschen komisch weils
nur funktioniert wenn ich der Klasse einen background zuweise. Versteh aber irgendwie nicht warum... Will das so
irgendwie nicht stehen lassen xD gibt sicher eine bessere lösung^^

[Bubble Gum]

Ehm wofür gibts extra Word-Wrap, overflow oder whitespace properties und derartiges?

text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;

Außerdem würd ich für deine Box dort lieber ein ul/li nutzen.