作者sean72 (.)
看板Web_Design
标题Re: [问题] 上下置中
时间Thu Aug 21 16:47:02 2014
我了解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;
: : }
: : 谢谢
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 76.169.54.91
※ 文章网址: http://webptt.com/cn.aspx?n=bbs/Web_Design/M.1408610826.A.3F4.html
※ 编辑: sean72 (76.169.54.91), 08/21/2014 16:48:13
※ 编辑: sean72 (76.169.54.91), 08/21/2014 16:50:03
※ 编辑: sean72 (76.169.54.91), 08/21/2014 17:00:18