Archived

This topic is now archived and is closed to further replies.

  • 0

Issue With "Fixed" Nav Bar On Mobile Devices


Question

Posted · Report post

Hi, 

I have been trying to fix this for a while now and have had no success. 

 

I have the fixed navigation bar activated on the site, however when you open up the site on a mobile for example on an iPhone and zoom in on the page, the "Fixed" nav is not fixed at all and ends up taking up 80% of the screen blocking the content. 

 

Here is my site: www.ijailbreakthis.com 

 

I have added no custom CSS to the fixed nav, so not sure what is going on. 

 

Please help, thanks in advance. 

Cheers, 
Matthew 

 

 

Share this post


Link to post
Share on other sites

29 answers to this question

Posted · Report post

Even if the div labelled 'my-add-image' is removed the top fixed nav still does not work correctly. 

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

I just looked at your site on an Android (Samsung Galaxy SIII), and zoomed in and out.  The fixed nav did not occupy any more space than it should. So I suspect that it needs some browser specific CSS.   We have a free plugin for that called Browser Specific CSS found at Dashboard > PageLines > Store > Plugins > Top Free.

 

I did take note that after zooming back, the fixed nav bar did shift to the right, remaining there, but it did not block any content. The problem I noticed with that is simply that the navigation disappeared off the fixed nav.  This could be the result of some custom CSS or a plugin conflict.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for the comments, I have just tested on an iPad and the fixed nav is perfect (zoomed and normal). It just seems to be iPhone?

 

What specific CSS do I need to add? 

Share this post


Link to post
Share on other sites