title: Footer menu not showing in Safari
body: <p>The site in question is: <a href="http://www.twisted-perfectionism.com" rel="nofollow">http://www.twisted-perfectionism.com</a></p>
  
  <p>I have this #secondary_nav which should appear at the bottom of the screen on mobile devices.
  It's working fine in both Firefox and Chrome, but in Safari it doesn't appear at all. Using Developer Tools I can see that it is placed correctly but it's invisible. I'm a newbie.. Please help!</p>
  
  <pre><code>@media only screen and (max-width : 880px) { [...] #secondary_nav {
      width: 100%;
      height: 12px;
      padding-top: 16px;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: url(../images/trans.png) repeat;
  }
  
  #secondary_nav &gt; ul {
      clear: left;
      float: left;
      margin: 0;
      padding: 0;
      position: relative;
      left: 50%;
      text-align: center;
      display: block;
  }
  
  #secondary_nav &gt; ul &gt; li {
      width: auto;
      display: block;
      clear: none;
      float: left;
      list-style: none;
      position: relative;
      right: 50%;
  }
  
  #secondary_nav ul li ul {
      left: 0;
      margin-right: 0;
  }
  
  #secondary_nav ul li ul li a {
      text-align: left; 
  } [...] }
  </code></pre>
  
  <p>The problem was fixed by removing:</p>
  
  <pre><code>overflow: auto;
  </code></pre>
  
  <p>The footer appears now, but on iOS, when scrolling down, the iOS bottom bard disappears and the footer doesn't come down until i take my finger off the display.</p>
  
  <p>See screenshot: <a href="http://s29.postimg.org/7r49yfzc7/Photo_17_05_14_02_06_16.png" rel="nofollow">http://s29.postimg.org/7r49yfzc7/Photo_17_05_14_02_06_16.png</a></p>