可重複使用的代碼段的最大寬度解決方案

Question

我得到了下面的代碼。這段代碼將被重複使用。它工作正常，但現在我有一個小問題，我不知道如何解決它。

當段落內的文字非常寬時，無論包含簡短的塊不是那麼寬，第二個div就會在下一行中折斷，並且我不希望下一行中的文本，我想要圖像div右側的文字。

解決這個問題的方法是在childrens div中添加一個最大寬度，但正如我所說的，代碼在整個周圍都被重用，而且我有很寬的容器。

 div.brief > div { 
      float: left; 
     } 

     div.image { 
      -moz-box-shadow: 0 0 5px #939393; 
      -ms-box-shadow: 0 0 5px #939393; 
      -o-box-shadow: 0 0 5px #939393; 
      -webkit-box-shadow: 0 0 5px #939393; 
      box-shadow: 0 0 5px #939393; 
      padding: 2px; 
      display: inline-block; 
      margin-right: 10px; 
     } 


         <div class="brief"> 
          <div> 
           <div class="image"><a href="#"><img width="33" height="33" src="aaa.jpg" title="aaa" alt="aaa" /></a></div> 
          </div> 
          <div> 
           <p>Boudin drumstick pancetta, beef ribs filet mignon pork belly short ribs bacon...</p> 
           <label>By:</label>&nbsp;<a href="#" class="smallhighlight">Somebody</a> 
          </div> 
         </div> 

任何提示？

Answer 1

請勿將您的img /文本包裝在div中？

例如這裏： http://jsfiddle.net/ANNLP/2/