如何垂直對齊移動網頁上的徽標

Question

我想垂直對齊即將推出的徽標，但沒有任何運氣。

我的代碼如下。

html  {width:100%;height:100%;background:url(images/bg.jpg) repeat #a3a4a6;} 
body  {width:100%;height:100%;margin:auto;padding:0px;font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#423932;overflow:hidden} 
#container {width:100%;height:100%;margin:auto;background:url(images/top_bg.jpg) no-repeat top center;vertical-align:middle;} 
#logo  {margin:auto;background:url(images/logo.png) no-repeat top center; line-height:50px;} 

任何反饋意見將不勝感激。

Answer 1

給你的#logo一個height，我認爲它應該做你想要的...如果我理解你的代碼。

例子：http://jsfiddle.net/jasongennaro/whxVY/1/

編輯

根據您的評論

我希望它出現垂直對齊 - 頁面的中間。

在這種情況下，請執行下列操作：

1. 給你一個#logo div和height:100%

2. 位置background-image爲center center

   #logo { 
       margin: auto; 
       background: url(images/logo.png) no-repeat center center; 
       height: 100%; 
   }