• 0
Sign in to follow this  
Followers 0

fixed header problem on mobile device


Question

Posted · Report post

Hello,

I have a quick question regarding my fixed header. I have a header in fixed position below a fixed navbar and everything works fine on my laptop but when I check on my iPhone, the header stays fixed while the navbar scrolls up (as I assume the navbar should). Do you know how to fix the header so it works like the fixed navbar on mobile devices? (haven't checked on an iPad...not sure if there are similar issues)

 

website: pencesense.com/testDMS

DMS version 1.1.4

WP version 3.8

 

Thanks!

jane

Share this post


Link to post
Share on other sites

5 answers to this question

  • 0

Posted · Report post

Hi Jane,

 

The Fixed Navbar is only fixed on large screens, if it were to be fixed on a tablet or mobile device it would take up too much screen real estate. Thats the reason as to why the fixed navbar isn't fixed. In regards to your header, you have added custom CSS to a TextBox so that its in a fixed position, but unlike the Fixed Navbar you haven't added any @media queries to tell that TextBox to stop being fixed when viewed on a device with a specific screen width.

 

Therefore, you're going to need to add some more custom CSS via media queries to resolve your issue. As this is custom CSS you have added we are unable to provide support, as we do not provide support for user created CSS. However, the link below is a great guide on Media queries.

 

http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

http://css-tricks.com/css-media-queries/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks, Danny...will check out those links!!

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Let us know how you get on.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks, James, for checking in. I did get it to work on at least a single iPhone using the @media! Now will have friends check on iPad and other smartphones. You can mark this as resolved as I think I understand how to work with @media to manage these kinds of device-specific issues.

 

Thanks again!

jane

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Happy to hear your issue has been resolved Jane!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0