javascript 图像在 Bootstrap 3 中的跨度内居中

Question

我遇到了一个问题，我必须将两个安全封条放在响应式付款表单底部的中央，其中一个工作正常，但另一个包含标签的工作不正常

<div class="container">
  <div class="row text-center">
    <div class="footer">
      <div class="col-md-12  col-sm-12" >
        <script type="text/javascript" src="https://sealserver.trustwave.com/seal.js?code=<?= $this->model->getTWKey() ?>"></script>
      </div>

      <div class="col-md-12 col-sm-12" >
        <span id="cdSiteSeal2" >          
          <script type="text/javascript" src="//tracedseals.starfieldtech.com/siteseal/get?scriptId=cdSiteSeal2&amp;cdSealType=Seal2&amp;sealId=55e4ye7y7mb73952743bf753a95b7cfvma3y7mb7355e4ye734fda9346a2ed18a"></script>
        </span>
      </div>
    </div>
  </div>
</div>

您可以看到页面here。我尝试了几种不同的方法（即偏移和创建居中 class ala）

.img-center {margin:0 auto;}

但是没有任何效果。

由于第一个 javascript 小部件中心很好，我只能得出结论，它正在做一些事情来阻止它工作。

我很确定我这样做的方式不完全正确，但我是后端开发人员而不是 UI 设计师，我只是想为我的客户提供一些东西。

Answer 1

通过检查 javascript 插入的元素，您可以看到需要居中的是 div，而不是图像。

尝试添加此 CSS 规则：

#siteSealFauxBadge > div { 
    margin: 0 auto;
}

Answer 2

添加css

#siteSealFauxBadge div:first-child {
margin: 0 auto;
}

你会得到如图所示的结果

javascript 图像在 Bootstrap 3 中的跨度内居中

Centering a javascript image inside a span in Bootstrap 3

html

javascript

css

twitter-bootstrap