Re: [问题] 上下置中

楼主: sean72 (.)   2014-08-21 16:47:02
我了解yshlptt版友的第二个例子给的程式
接着想套在自己的练习上面
却怎样也无法达成效果
例如 (故意将navbar height改成80px)
http://jsfiddle.net/953ey9eb/10/
问题:
1.
.navbar-fixed-bottom{
height: 80px;
}
为什么 google chrome element inspector 告诉我container height: 62px
况且我也设定了 .container height:100%
contianer应该要和父元素的高度相等才对吧?
2.
我也试过将 .navbar-text pull-right 移除
改成下面的状态
navbar-fixed-bottom > container > my-container > my-content > a
失败
3.
请问我该怎么做才能够将这个social icon放置在bootstrap container
靠右置中
谢谢
※ 引述《yshlptt (小y)》之铭言:
: Hi,
: 我目前知道两种可以把区块垂直置中的方法,
: 两种方式各有好坏,请自行依排板需求选择
: 一、使用绝对位置定位
: 把 container 元素设为 position: relative(或依需求设定 absolute)
: 再把内容元素设定为 position: absolute,
: 并加上 margin: auto; top: 0; bottom: 0; 这三组设定即可
: 范例:
: http://jsfiddle.net/elin/ug3L3ut0/
: 二、使用 display: table-cell
: 这个作法要多包一层 tag,不过 CSS 设定相对简单一些,
: 简单来说就是在最外层设定 display: table,
: 第二层设定 display: table-cell; vertical-align: middle;
: 这样一来内容元素就会垂直置中
: 范例:
: http://jsfiddle.net/elin/4zprbaq5/
: ※ 引述《sean72 (.)》之铭言:
: : http://jsbin.com/notifucigedo/4/edit?html,css,output
: : 随意用了bootstrap做了一个footer
: : 如果我故意将.footer height调成150px
: : 我该如何将.navbar-text的放在footer上下的中央?
: : 为什么我下面的css不起做用呢?
: : .footer-container{
: : vertical-align: middle;
: : }
: : 谢谢

Links booklink

Contact Us: admin [ a t ] ucptt.com