可重复使用的代码段的最大宽度解决方案

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/