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