Фиксированный позиционированный заголовок сохраняется на рабочем столе, но не на мобильном устройстве?

Question

Если вы ограничены в браузере, вы увидите элемент .header-mobile. Он закреплен позиционирован. И он сохраняется на рабочем столе, но на мобильных устройствах он просто остается на вершине.

Это мобильный CSS:

@media handheld, only screen and (max-width: 767px) { 

    #header, 
    #header-fixed { 
    display: none; 
    } 

    #header-mobile { 
    background: url(images/header-fixed-bg.png) repeat-x 0 0; 
    border-bottom: 1px solid #111; 
    display: block; 
    position: fixed; 
    top: 0; 
    width: 100%; 
    -webkit-box-shadow: rgba(0,0,0,0.3) 0 0 4px; 
    -moz-box-shadow: rgba(0,0,0,0.3) 0 0 4px; 
    box-shadow: rgba(0,0,0,0.3) 0 0 4px; 
    } 

HTML-:

<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    </header> 
    <div id="header-mobile"> 
    <div id="header-mobile-content"> 
     <h1 class="logo"><a href="<?php echo esc_url(home_url('/')); ?>" title="<?php echo esc_attr(get_bloginfo('name', 'display')); ?>" rel="home">test</a></h1> 
     <a class="button button-small" href=""> 
     <img src="<?php bloginfo('template_url'); ?>/images/icon-button.png" alt="" /> 
     <span>Request a quote</span> 
     </a> 
     <ul class="navigation-mobile"> 
     <li> 
      <a class="responsive" href="#responsive"> 
      <span>Responsive Design</span> 
      </a> 
     </li> 
     <li> 
      <a class="touch" href="#touch"> 
      <span>Touch Friendly</span> 
      </a> 
     </li> 
     <li> 
      <a class="programming" href="#programming"> 
      <span>Custom Programming</span> 
      </a> 
     </li> 
     <li> 
      <a class="mobile" href="#mobile"> 
      <span>Mobile/Site Apps</span> 
      </a> 
     </li> 
     </ul> 
    </div> 
    </div> 

Живой сайт: http://www.hfwebdesign.com/?ModPagespeed=off

Что может быть причиной?

Answer 1

Я не знаю, почему, но я должен был добавить это:

<meta content='width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no' name='viewport'>