更改容器高度后如何在流体容器中垂直居中

时间:2014-06-21 02:55:32

标签: twitter-bootstrap-3

我无法弄清楚我需要在css中做什么才能让'row'类在我的容器中垂直居中。当我增加容器高度的大小时,行确实水平居中,而不是垂直居中。我对这些东西很陌生,想要一些帮助!感谢。

 <div class="container-fluid">
            <div class="center-block">
                <div class="row-fluid">
                    <div class="col-md-4">
                       <img class="img-circle" img src="img/book.png" alt="test">
                       <h3>Training & Education.</h3>
                       <p>I love training and educating other people.  It inspires  me to keep       learning so that I can spread my knowledge around to everyone.  Whether it's computer related or in the gym, I thrive off of motivating and inspiring others.</p>
                    </div>

                    <div class="col-md-4">
                       <img class="img-circle" img src="img/book.png" alt="test">
                       <h3>Training & Education.</h3>
                       <p>I love training and educating other people.  It inspires me to keep learning so that I can spread my knowledge around to everyone.  Whether it's computer related or in the gym, I thrive off of motivating and inspiring others.</p>

                           </div>

                    <div class="col-md-4">
                       <img class="img-circle" img src="img/book.png" alt="test">
                       <h3>Training & Education.</h3>
                       <p>I love training and educating other people.  It inspires me to keep learning so that I can spread my knowledge around to everyone.  Whether it's computer related or in the gym, I thrive off of motivating and inspiring others.</p>
                    </div>
                </div>
              </div>
          </div>




'.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}


.row-fluid {
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 0px;
    margin-left: 20px;
    margin-right: 20px;
    text-align: center;
}

.container-fluid {
    background-color: orange;
    height: 500px;
}'

0 个答案:

没有答案