看板 Web_Design 關於我們 聯絡資訊
我了解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://www.ptt.cc/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