如何在div中垂直對齊？

Question

我不知道如何對齊當前在標題的左上方的文本，使其出現在底部 。 任何建議將不勝感激：

這是現在的樣子：

這就是我想要的樣子：

這是我到目前為止的代碼：

        <div id="header_container">
           <div id="subheader-left" style="float:left; width:50%; text-align:left">chilun liu</div>
              <div id="subheader-right" style="float:right; width:50%; text-align:right">
    <!-- the Social Network's images  -->  
              </div>         
           </div>
        </div>

Answer 1

將此添加到您現有的CSS

#subheader-left,#subheader-right{
 display:table-cell;
 vertical-align:bottom
}

側面說明： IE8及更高版本支持此解決方案...

另外

style="border:none; width="40" height="40"

應該

style="border:none; width:40px; height:40px"
                      /*  ^^ no "=" sign or quotes,instead, 
                         semi colon and values only */

Answer 2

嘗試，

#subheader-left { position: absolute; bottom: 0; left: 0; }