Jump to content

Archived

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

janemackey

fixed header problem on mobile device

Recommended Posts

janemackey    0
janemackey

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
Danny    1,327
Danny

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/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
janemackey    0
janemackey

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

Share this post


Link to post
Share on other sites
James B    436
James B

Let us know how you get on.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
janemackey    0
janemackey

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
Danny    1,327
Danny

Happy to hear your issue has been resolved Jane!


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • kwaoru
      By kwaoru
      Hi,
       
      I have been using DMS and pagelines.
      I am facing to a huge trouble with the appearance of one of my page on mobile (smart phones) built with pagelines.
      However I haven’t come to any solutions to organise either edit the appearance of mobile view to look neat or deactivate the responsive function. 
      Now it looks totally messy on the phone...
       
      1. Is there any way to edit the appearance of the mobile version (responsive theme)?
      2. Is there any way to deactivate responsive function?
       
      If I could receive support from you to go thorough this process I would be happy to be a pro member. 
       
      Looking forward to hearing from you.
    • poseyg
      By poseyg+
      This just happened to a site I'm working on. When I decrease width of browser to check for responsiveness...the pagelines content section is not responding???
    • yemoonyah
      By yemoonyah+
      While building my website, I set a padding of 5%, 25%, 5%, 25% so the text on the pages is not too wide.
      However, it looks crappy on mobile.
      How do I get the same effect and still have it look good on mobile?
      Example: http://yemoonyah.com/quiz
      Thanks
    • flourishdesignstudio
      By flourishdesignstudio
      Hello,
      I have an older site that was built using PageLines several years ago (prior to the release of DMS). I wanted to leverage some of the power of your new PL5 plugin but the theme prevents be from adding any generated custom sidebars to the theme (through the drag and drop interface) and does not allow me to add any PL5 sections/containers/etc to the header or footer. Is there any way to easily override that or am I stuck only using PL5 in the content areas of the site?
      Thanks so much for the help!
    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      can I limit the overall of MegaNav on mobile? When I look at michaelkummer.com on a mobile device, the menu takes up more than a third of the screen space. Using CSS to limit max-height doesn't seem to work. Is there another/better way to reduce the overall height to maybe 10% of the screen available?
      Thanks
      Michael
       
×