• 0

Hooks in fixed Navbar display off screen when the browser is resized or in mobile display


Question

Posted · Report post

Hi, I am trying to use hooks in Pagelines DMS to offset a 'Login' link, a 'Sign Up' button, and a 'Contact' text on the Fixed Navbar.  It looks fine when the browser is at least the width of the full website:

 

[attachment=1878:Screen Shot 2014-01-03 at 2.05.00 PM.png]

 

However, when resizing the browser or viewing my site on mobile it seems to create a new section off the page for the hooks:

[attachment=1879:Screen Shot 2014-01-03 at 2.05.12 PM.png]

 

My website is currently on a staging server, and can be accessed at payline.staging.wpengine.com 

 

I would ideally like to have these items still appear on the Navbar.  Can you please help identify the issue and direct me towards a resolution?

 

Thanks!

Share this post


Link to post
Share on other sites

2 answers to this question

  • 0

Posted · Report post

Hi there, 

 

Looking in firebug it seems that each element adding in the hooks has been given absolute position and inline css styling. I would say it would be easier to group everything inside one div container and give it a class name, then you'll be able to control that whole unit as one object rather than each element independently. 

 

When the mobile browser layout kicks in, the container with the menu and the logo goes 100% width, with the logo floating on the left and the menu floating on the right. So your section will need to be set to stack underneath this. Absolute positioning and the fact the branding container goes full width is stopping the items from flowing with the rest of the page. 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks for the speedy reply, will try this!

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