Bootstrap，我如何在圖片和文字之間添加空格？

Question

我有一個圖像和一個文本並排，但現在我需要在每組文本和圖像之間添加一些間距。在這裏我的代碼。

.container { 
 
    float: left; 
 
    display: block; 
 
    margin-top: 5%; 
 
}

<div class="container"> 
 
    <!--Row with three equal columns--> 
 
    <div class="row"> 
 
    <div class="col-md-4"> 
 
     <div class="demo-content"> 
 
     <img src="images/squareicon.png" class="pull-left"> 
 
     <h3>Versatile Spaces</h3> 
 
     <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-4"> 
 
     <div class="demo-content bg-alt"> 
 
     <img src="images/pointericon.png" class="pull-left"> 
 
     <h3>Central Location</h3> 
 
     <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-4"> 
 
     <div class="demo-content"> 
 
     <img src="images/foodicon.png" class="pull-left"> 
 
     <h3>Catering to Taste</h3> 
 
     <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

你可以把保證金圖像：

.demo-content img { 
    margin-right: 20px; 
}