CSS：水平居中2个图像，并给它们一个边距

Question

我正在使用bootstrap为项目构建模板，我需要将一些社交图标集中在一起，这是一个图像：

现在，我有一些JS决定我是否需要附加1个或2个社交图标，包含1个图标，我只想将其置于中心位置，加上2个图标，我想将它们放在彼此旁边余量。 单独使用CSS是否可行？

在图像中，我只是应用了一个左边距，因为它们向左浮动，这使它们稍微对齐，但这没有响应，并且它不支持单个图像。

这是HTML：

<div class="row social_row">
    <img class="social_icon" id="facebook_share" src="assets/images/social/facebook.png">
    <img class="social_icon" src="assets/images/social/pinterest.png">
</div>      

这是CSS：

.social_row {
   margin-right: 15px;
   margin-left: 15px;
}

.social_icon {
  height: 45px; 
  width: 45px; 
  display: block; 
  float: left;
  margin-right: 5%;
}

Answer 1

text-align:center行（我认为使用Bootstrap的.text-center类），然后将左/右边距放在img上。

http://bootply.com/88212

<div class="row social_row text-center">
    <img class="social_icon" id="facebook_share" src="assets/images/social/facebook.png">
    <img class="social_icon" src="assets/images/social/pinterest.png">
</div>

CSS：

.social_row img {
    margin:0 2.5%;
}