如何在絕對定位範圍內包裝文本？

Question

子彈文本將需要一個很長的字符串，如代碼所示，它不能是單獨的單詞。

溢出汽車似乎不工作它剪輯子彈文本。

子彈文本需要保持絕對位置。

我想將文本包裝到下一行，我該怎麼做？

<ul> 
    <li class="list-item"> 
     <span class="bullet-text">test_123_test</span> 
     <cite>Lorem ispusm dolor sit</cite> 
    </li> 
</ul> 


.list-item { 
    list-style: none outside none; 
} 

.bullet-text { 
    background-color:grey; 
    left:0; 
    position:absolute; 
    width:2em; 
} 

cite { 
    padding-left:10px 
} 

http://jsfiddle.net/Grundizer/7krMv/1/

Answer 1

您正在尋找word-wrap: break-word。

jsFiddle example

.bullet-text { 
    background-color:grey; 
    left:0; 
    position:absolute; 
    width:2em; 
    word-wrap: break-word; 
} 

Answer 2

一個黑客一點，但你可以這樣做：

<cite><br />Lorem ispusm dolor sit</cite>