Как вертикально выровнять логотип на мобильной веб-странице - PullRequest
Новая
       14

Как вертикально выровнять логотип на мобильной веб-странице

1 голос
/ 09 октября 2011

Я пытаюсь выровнять логотип, который скоро появится, но безуспешно.

Мой код указан ниже. 

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

Любые отзывы приветствуются.

1 Ответ

1 голос
/ 09 октября 2011

Дайте #logo a height, и я думаю, что он должен делать то, что вы хотите ... если я понимаю ваш код.

Пример: http://jsfiddle.net/jasongennaro/whxVY/1/

РЕДАКТИРОВАТЬ

В соответствии с вашим комментарием

я хочу, чтобы он отображался вертикально по центру - в середине страницы.* В этом случае выполните следующие действия:

  1. укажите для #logo div a height:100% и

  2. положение background-image как center center

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