Как обернуть текст внутри абсолютного позиционного диапазона?

Question

текст пули должен быть длинной строкой, как показано в коде, это не может быть отдельный текст.

overflow auto, похоже, не работает, он зажимает текст пули.

Текст пули должен оставаться в абсолютном выражении.

Я хотел бы обернуть текст на следующую строку ниже, как я могу это сделать?

<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>