Bootstrap 3.0 - 将元素推到底部 [英] Bootstrap 3.0 - push element to bottom

问题描述

我选择了Twitter Bootstrap来快速显示应用程序图层，最近我遇到了问题。

我试图将元素push到页面容器的底部，但保持居中。添加类
.push-to-bottom {position：absolute;这个问题的主要问题在于我的穷人有关CSS和Bootstrap对话的知识。
我发现这个解决方案是可以接受的，也许这不是最好的方法，但是它可以工作，而且它完全可以负责。



 < div class =container> 
< div id =home> 
< div class =row> 
< div class =col-lg-12> 
< h1>某些标题< / h1> 
< / div> 
< / div> 
< / div> 
< / div> 
  

主要目标是让div完全居中居中，所以#home div被包装在容器中，然后给#home div的位置：绝对属性，然后简单地改变底部属性都固定或给定的百分比。

I chose Twitter Bootstrap for quick app display layer bulding, recently I have faced problem.

I'm trying to push element to bottom of page container, but keeping it centered. Adding class .push-to-bottom { position: absolute; bottom: 50px } didn't help.

解决方案

Well, the main problem was in my poor knowledge of CSS and Bootstrap convetions. I found this solution acceptable, maybe it isn't the best approach, but it works, and it is fully reponsible.

<div class="container">
  <div id="home"> 
    <div class="row">
      <div class="col-lg-12">
        <h1>Some heading</h1>
      </div>
    </div>
  </div>  
</div>

Main goal was to keep div fully centered horizontally, so #home div is wrapped inside container, then give the #home div position: absolute property, and then is simply change bottom property both fixed or given in percentage.

这篇关于Bootstrap 3.0 - 将元素推到底部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！