李跨度浮浮左向右

Question

我需要做到以下幾點：

|text1| lots of text lots of text lots |text3| 
lots of text lots of text lots of text lots 
of text 

它的結構爲：

<li><span>text1</span><span>text3</span><span>lots of text</span></li> 

文字3是浮動的權利。

問題是我需要在很多文本上設置寬度，因爲我需要背景色來填充整行的寬度。如果我將它設置爲float：left，它將沿着一條線並且與text1或text2不在同一行。

Answer 1

<li>
<span id="left">text1</span>
<span class="withbg">lots of text</span>
<span id="right">text3</span>
</li>

跨度{
浮動：左;
display：inline;
}
span.withbg {
width：200px;
背景：紅色;
}

它在這裏jsFiddle