Archived

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

  • 0

Aligning main nav and second nav


Question

Posted · Report post

Hi, I hope someone can help me with this, because I have browsed all the forums, but can't find an answer...

 

At http://kootpiano.nl/wp, I would like to:

1. left align my main and secondary nav with the header (the sec nav lines with the header, but I can't find how to adjust the main nav)

2. diminish the horizontal space between the main and secondary nav

3. divide the space between the main and secondary nav with a horizontal line (1px)

 

I already have made some adjustments in the Custom Css, and some work, but some don't. I also tried to make these adjustments via the Pageline Customize Plugin, but that did not seem to work. Is there a big difference between those two, or is it just what one prefers?

 

Thanks in advance!!

Eva

Share this post


Link to post
Share on other sites

9 answers to this question

Posted · Report post

Hi,

 

The cause of the spacing is padding, each main navigation menu link has padding of 10px on top and bottom and 15px left and right. If you inspect your menu links for both the main navigation and secondary navigation, you will be able to see the this and the code used.

 

 

I recommend using Firebug or your browsers built-in web dev tools and inspect the each navigation section menu items a element to find the correct code and then reduce the left padding to 0.

 

For assistance visit our custom CSS documentation - http://support.pagelines.me/docs/customization/custom-css/

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, thanks. I have added #site in my Custom CSS, and it works fine I think.

I just can't find what I need to change in order to:

 

 

left align my main and secondary nav with the header (the sec nav lines with the header, but I can't find how to adjust the main nav)

diminish the horizontal space between the main and secondary nav

divide the space between the main and secondary nav with a horizontal line (1px)

 

I appreciate any help.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks a lot Danny,

Don and it works!!

By the way, is it wise to use #site at all changes in Custom CSS?

Share this post


Link to post
Share on other sites

Posted · Report post

I am sorry to bother you again, but just one more thing: I would like to change the text color of the a active in the second nav. Is that possible?Thanks again!

Share this post


Link to post
Share on other sites

Posted · Report post

You style a navigation menu active item, you will want to read here for assistance - http://codex.wordpress.org/Function_Reference/wp_nav_menu#Menu_Item_CSS_Classes

 

#site .section-secondnav ul li.current-menu-item a { }

Using #site is simply a method to guarantee your custom CSS overrides the default PageLines styling, so there is no issue using it. We actually recommend it.

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks again Danny, you have been a great help. Now everything works fine.

Share this post


Link to post
Share on other sites

Posted · Report post

Great, happy to hear your issue(s) have been resolved.

 

However, in future when your original question has been answered correctly, can you refrain from asking other questions please. If you have another question, please create a new topic, this will assist other users in the future who may have a similar question.

Share this post


Link to post
Share on other sites

Posted · Report post

Ok, I will remember this for the future. Maybe I can add extra tags to this topic to be of any help?

Share this post


Link to post
Share on other sites