Jump to content
Sign in to follow this  
mobbbx

Adding border for custom Nav bar

Recommended Posts

mobbbx

trying to add bottom border for a custom nav bar (similar to the primary nav through the css

#nav_row.main_nav, ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
) that was created by adding a section.3rdnav.php in platformbase section folder. Code for section.3rdnav.php:
class Base3rdNav extends PageLinesSection {
	   function __construct( $registered_settings = array() ) {
	
			/* The name and ID of the section */
			$name = __('3rdNav Section', 'pagelines');
			$id = '3rdnav';
	
			/* Setup description, areas it works with, icon, etc...*/
			$settings = array(
				'description' 	=> 'Creates a 3rd nav section in Base',
				'workswith' 	=> array('header'),
				'icon'			=> CHILD_IMAGES . '/icon-pullquote.png'
			);
	
			/* Draw section using the section API */
		   	parent:GDN__construct($name, $id, $settings);
	   }
	
		/* Use this function to create the template for the section */
	 	function section_template() {
	
		?><div id="3rd_nav" class="main_nav fix"><?php
				if(function_exists('wp_nav_menu')){
	//			wp_nav_menu( array('menu_class' => 'main-nav', 'container' => null, 'container_class' => '', 'depth' => 3, 'theme_location' =>'globalnav', 'fallback_cb'=>'nav_fallback') );
				wp_nav_menu( array('menu_class' => 'main-nav sf-menu', 'container' => null, 'container_class' => '', 'depth' => 3, 'theme_location'=>'3rdnav', 'fallback_cb'=>'nav_fallback') );
				}
	
		?></div><?php
			}
	
		function section_persistent(){
	
				register_nav_menus( array('3rdnav' => __( '3rd Navigation', 'pagelines' ) ) );
	
		}
	
	}
I have tried using custom css in bacse.css to create bottom border:
	#3rd_nav.sf-menu, ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.main_nav.sf-menu, ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.main_nav { border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.main-nav.sf-menu, ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.main-nav, ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.'main_nav fix', ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	#3rd_nav.'main-nav sf-menu', ul.sf-menu ul li{ border-bottom: 1px solid #E9E9E9; }
	

http://www.indoutensil.com/company Thanks guys!

Share this post


Link to post
Share on other sites
Kate

Hi Rudy, Where should the nav be showing up, please? I'm not seeing it...

Share this post


Link to post
Share on other sites
mobbbx

thanks kate! I managed to solved it. by changing the id from "3rd_nav" to "third_nav". For some reason, the custom css cant be shown for id with a starting numerical value.

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  

×