クラスの境界線を他のクラスに拡張する方法

Question

友人クラスの境界線を人名から追加友人クラスまで全面的に拡張したいと思います。

HTML

<div class = 'friends'> Persons Name</div> 
    <div class = 'buttons'> add as friend </div> 

CSS

.friends { 
      border: 1px solid; 
      display: inline; 
      } 
.buttons { 
      background-color:blue; 
      float: right; 
      width: 50px; 
      display: inline; 
      } 

私はadded a jsfiddle問題を実証しています。私はそれはあなたがやろうとしているものだと思います

HTML

<div class = 'friends'> Persons Name 
    <div class = 'buttons'> add as friend </div> 
</div> 

CSS

.friends { 
     border: 1px solid; 
     display: block; 
     width: 100%; 
     } 

.buttons { 
     background-color:blue; 
     float: right; 
     display: inline; 
     } 

：

Answer 1

はこのようにそれをやってみてください。

Answer 2

This要素の高さを設定することができます。