Jump to content


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


Navbar at bottom with header at fixed height

Recommended Posts

stevenpeeters    1



I have a header with fixed height of 300px.

I want the navbar at bottom inside the header, but it always moves to top.


I tried several CSS but it always gets overwritten.


Any ideas?



Share this post

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

Hi there, can we have a link to the live page so we can see the setup and take a look at what css you could use.

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
stevenpeeters    1


Problem is that the site is live and I was trying to update header in the preview.



The things I did was, all is in full with:

  1. Set at header background image. To have it nicely displayed I had to have the header have a fix min height of 300pix
  2. I added a simple navbar which is at top
  3. I added main Navbar, this shows now below the simple navbar.

I want it to move to bottom of header, not below simple navbar.


I can add classes to navbar like .header-navbar.


The main goal is to have the header look something like:



thx for trying to help me.

Share this post

Link to post
Share on other sites
Danny    1,327



If you want to have a similar header area as the site you linked, all you need to do is add an image to the header area settings, then drag and drop the NavBar section beneath that. You will need to customize the style of the NavBar to have a similar to that sites navigation.

Please search our forums, before posting!

Share this post

Link to post
Share on other sites

  • Similar Content

    • Grant Turck
      By Grant Turck+
      Navbar Broken on All Devices When Not Logged Into Wordpress. See screenshots attached from mobile. What is causing this issue and how do I fix? Site is venicepride [dot] org.

    • flourishdesignstudio
      By flourishdesignstudio
      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!
    • JP
      By JP+
      How can you set the translations with platform5, the parts that are not in pages or posts? Texts and images…
    • romanondrasek
      By romanondrasek
      hi all, I have some trouble using PL5 on my site. 
      I used plugins for event calendar (event on) and plugin (timetable responsive scheduler for WP) for schedule (classes) in the gym.
      The problem is, that post from this 2 plugins are shown without menu in header and footer. (I setup header and footer) in the page editor for all type of page. 
      When I create a lesson, it creates posts with slug (I have a slug "lekce" & event for events).
      I try to edit the post with PL editor, but editor is not opening on the post.

      Do you have some idea where should be some problem? Thanx so much.
      here are links for the sites :
      site with schedule :
      site of one of the class (pilates)
      site with calendar :
      7 side with one event from the calendar :
      when I have my site on DMS2 it was working :-(
    • PierreFF
      By PierreFF+
      I have an issue with NavPro on mobile when the link of the menue is on the same page. 
      Here is my website: http://foundersofthefuture.co
      The isssue comes from the fact that in my menue most of the items send somewhere else on the same page using anchor link (eg. #container_u788888). 
      This works well on desktop but on mobile, nothing happens when clicking on the link. One of the link of the menue of the homepage "France" sends to another page of the website and this one works well even on mobile. 
      I am using the Pagelines framework theme and also used a wordpress plugin (jQuery Smooth Scroll) for smooth scrolling . 
      Thanks in advance for your help and let me know if I need to provide more information.