Fotorama:尝试将fotorama div放在bootstrap中

Question

我到处都找过了，但还是找不到答案。我正在尝试使用fotorama在引导网页上创建一个图片库，但fotorama div一直显示在页面的左侧。我已经在不同的地方尝试了空白处:0自动，我已经尝试添加文本中心和中心块类，但都没有效果。我认为fotorama js中的某些东西导致图像不居中。我曾尝试构建一个js小提琴，但不太确定如何工作- apologies.Any的帮助将非常感谢。下面是我的http://jsfiddle.net/q5ujq37n代码：

<div id="menu2" class="tab-pane fade">
          <h3 class="text-warning">Thunder and lightning</h3>
          <p>text here</p>
          <div class="container-fluid" style="margin: 0 auto !important;">
          <div class="container-fluid fotorama" style="margin: 0 auto !important;" data-autoplay="true" data-width="50%" data-ratio="700/467" data-max-width="100%" data-allowfullscreen="true">

              <img  src="img/snow2.jpg">
              <img  src="img/snow1.jpg">
              <img  src="img/snow3.jpg">
              <img  src="img/snow4.jpg">
              <img  src="img/snow5.jpg">
              <img  src="img/snow6.jpg">
              <img  src="img/snow7.jpg">

          </div>
          </div> 
      </div>

Answer 1

只需将以下css代码添加到fotorama.css :)

.fotorama__wrap {
margin: 0 auto; }