benjaminmorgan Posted December 18, 2011 Report Posted December 18, 2011 I am building a wordpress site. I have a horizontal navigation with 4 links. Under the commercial page I have 4 sub pages. The client doesn't want it added in as a hover. he wants it on the side of the commercial page. How can I just display the second level of links? In the horizontal nav I have a different div class and on the sidebar i have a different div class. If you could help me out that would be great. /* SIDE LEVEL 2 NAVIGATION */ .navigationallink .pagenav ul li { display: none; } .navigationallink .pagenav ul li ul { width: 200px; border-radius: 25px; float: left; margin: 0; display: block; padding: 0; padding-top: 0px; list-style: none; visibility: visible; } .navigationallink .pagenav ul li ul li { list-style-type: none; color: #FFFFFF; display:block; width: 200px; float: left; visibility: visible; } .navigationallink .pagenav ul li ul li a { width: 200px; background: url('images/gradback.gif'); display: inline-block; padding: 0px; margin: 0px; color: yellow; font-weight: bold; text-align: center; text-decoration: none; height: 30px; line-height: 30px; } .navigationallink .pagenav ul li ul li a:hover { background: url('images/hoverstate.gif'); } /* END NAVIGATION */ Quote
benjaminmorgan Posted December 19, 2011 Author Report Posted December 19, 2011 Here is the source code. The level that shows Burglar Alarm is the only one I want to show in the sidebar. I will add more pages to that level later once i get this done and figured out. <div class="navigationallink"> <ul id="sidenav"> <li class="pagenav"><h2 class="displaynone">Pages</h2><ul><li class="page_item page-item-4"><a href="http://localhost/wordpresse/">About Us</a></li> <li class="page_item page-item-7 current_page_item"><a href="http://localhost/wordpresse/commercial/">Commercial</a> <ul class='children'> <li class="page_item page-item-15"><a href="http://localhost/wordpresse/commercial/burglar-alarm/">Burglar Alarm</a></li> </ul> </li> <li class="page_item page-item-9"><a href="http://localhost/wordpresse/residential/">Residential</a></li> <li class="page_item page-item-11"><a href="http://localhost/wordpresse/contact-us/">Contact Us</a></li> </ul></li> </ul> </div> Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.