Question

我有一个问题，我希望li保持在最底层的coloumn 这是我的代码

<div class="row">
  <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <p>lorem ipsum</p>
              <h2>lorem ipsum</h2>
            </div>
            <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
              <div class="row">
                <div class="detil">
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                  <li>Lorem ipsum.</li>
                </div>
               </div>
              </div>
            </div>
            <div class="col-lg-2 col-md-2 col-sm-12 col-xs-12">
              <h2>10</h2>
              <p>Lorem ipsum.</p>
            </div>
          </div>

CSS

h2,p{
  margin-top:0;
  margin-bottom:0;
}

http://codepen.io/vicario/pen/eZJpov

你可以看到我的列表到顶部，我如何让它到底？

Answer 1

修复错误

我只需要添加这样的课程

    .row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
}

并将detil设置为

.detil {
  position: absolute;
  bottom: 0;
}

强制文字留在coloumn bootstrap 3的底部

1 个答案: