如何垂直对齐移动网页上的徽标

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%; 
   }