引導程序中的垂直對齊

Question

嗨，我在讓一段文本在以下div中垂直對齊遇到了一些麻煩：

           <div class = "col-md-12" style = "height:60%;padding:10px;">
              <div style = "background-color: #ffec31;height:100%;">
                 <p>
                    blah
                 </p>
              </div>
           </div>

（內聯樣式僅用於將在某個時候進行的測試）

我不知道該怎么做，我已經嘗試了各種方法，包括：

position: relative;
top: 50%;
transform: translateY(-50%);

但是也許我做錯了。

多謝

Answer 1

http://jsfiddle.net/zj9v81t7/24/參見jsfiddle。

.col-md-12{ height: 74px;
    padding: 10px;}
p {
    height: 20px;
    margin-top: -10px;
    position: absolute;
    top: 50%;
}

Answer 2

https://gist.github.com/marioblas/9952094

/* Align vertically a column */
.v-align {
    float: none;
    display: inline-block;
    vertical-align: middle;
}