Pull Down Menu Overlap

  • CXLink
  • Expert
  • Expert
  • User avatar
  • Posts: 685
  • Loc: ATL-GA

Post 3+ Months Ago

Happy Monday!
I am having a problem with a pull down menu on a site and while I thought fixing it would be simple I am having some problems. The site is dmpc.org. The screw up is under the Ministries pulldown and the flyout. It is covering 2 other items. I'll put the code below but I feel like its something simple that I am missing.

Thanks in advance.

HTML
Code: [ Select ]
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-97" id="menu-item-97"><a href="http://www.dmpc.org/ministries/">Ministries</a>
<ul class="sub-menu">
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-428" id="menu-item-428"><a href="http://www.dmpc.org/ministries/worship-times/">Worship Times</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-420" id="menu-item-420"><a href="http://www.dmpc.org/ministries/after-school-program/">After-School Program</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-421" id="menu-item-421"><a href="http://www.dmpc.org/ministries/chi-rho-youth-group/">Chi-Rho Youth Group</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-422" id="menu-item-422"><a href="http://www.dmpc.org/ministries/christian-education/">Christian Education</a>
    <ul class="sub-menu">
        <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-424" id="menu-item-424"><a href="http://www.dmpc.org/ministries/christian-education/children-and-youth/">Infants, Children and Youth</a></li>
        <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-423" id="menu-item-423"><a href="http://www.dmpc.org/ministries/christian-education/adults/">Adults</a></li>
    </ul>
</li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-425" id="menu-item-425"><a href="http://www.dmpc.org/ministries/college-ministry-with-de/">College Ministry with D&amp;E</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-426" id="menu-item-426"><a href="http://www.dmpc.org/ministries/music-ministries/">Music Ministries</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-427" id="menu-item-427"><a href="http://www.dmpc.org/ministries/presbyterian-women-2/">Presbyterian Women</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-468" id="menu-item-468"><a href="http://www.dmpc.org/ministries/mens-ministries/">Mens Ministries</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-520" id="menu-item-520"><a href="http://www.dmpc.org/ministries/worship-in-motion/">Worship In Motion</a></li>
    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-499" id="menu-item-499"><a href="http://www.dmpc.org/ministries/younger-adults-at-dmpc/">Young(er) Adults at DMPC</a></li>
</ul>
</li>
  1. <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-97" id="menu-item-97"><a href="http://www.dmpc.org/ministries/">Ministries</a>
  2. <ul class="sub-menu">
  3.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-428" id="menu-item-428"><a href="http://www.dmpc.org/ministries/worship-times/">Worship Times</a></li>
  4.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-420" id="menu-item-420"><a href="http://www.dmpc.org/ministries/after-school-program/">After-School Program</a></li>
  5.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-421" id="menu-item-421"><a href="http://www.dmpc.org/ministries/chi-rho-youth-group/">Chi-Rho Youth Group</a></li>
  6.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-422" id="menu-item-422"><a href="http://www.dmpc.org/ministries/christian-education/">Christian Education</a>
  7.     <ul class="sub-menu">
  8.         <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-424" id="menu-item-424"><a href="http://www.dmpc.org/ministries/christian-education/children-and-youth/">Infants, Children and Youth</a></li>
  9.         <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-423" id="menu-item-423"><a href="http://www.dmpc.org/ministries/christian-education/adults/">Adults</a></li>
  10.     </ul>
  11. </li>
  12.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-425" id="menu-item-425"><a href="http://www.dmpc.org/ministries/college-ministry-with-de/">College Ministry with D&amp;E</a></li>
  13.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-426" id="menu-item-426"><a href="http://www.dmpc.org/ministries/music-ministries/">Music Ministries</a></li>
  14.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-427" id="menu-item-427"><a href="http://www.dmpc.org/ministries/presbyterian-women-2/">Presbyterian Women</a></li>
  15.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-468" id="menu-item-468"><a href="http://www.dmpc.org/ministries/mens-ministries/">Mens Ministries</a></li>
  16.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-520" id="menu-item-520"><a href="http://www.dmpc.org/ministries/worship-in-motion/">Worship In Motion</a></li>
  17.     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-499" id="menu-item-499"><a href="http://www.dmpc.org/ministries/younger-adults-at-dmpc/">Young(er) Adults at DMPC</a></li>
  18. </ul>
  19. </li>


CSS
Code: [ Select ]
#top_header nav ul li ul {
  background: none repeat scroll 0 0 #FFFFFF;
  border-radius: 0 0 5px 5px;
  box-shadow: 0 4px 6px #BCBCBC;
  left: -999em;
  padding: 0 14px;
  position: absolute;
  width: 230px;
  z-index: 100;
}
#top_header nav ul li ul li ul {
  width: 210px;
}
  1. #top_header nav ul li ul {
  2.   background: none repeat scroll 0 0 #FFFFFF;
  3.   border-radius: 0 0 5px 5px;
  4.   box-shadow: 0 4px 6px #BCBCBC;
  5.   left: -999em;
  6.   padding: 0 14px;
  7.   position: absolute;
  8.   width: 230px;
  9.   z-index: 100;
  10. }
  11. #top_header nav ul li ul li ul {
  12.   width: 210px;
  13. }
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • typhon
  • Guru
  • Guru
  • User avatar
  • Posts: 1294
  • Loc: Memphis, Tn

Post 3+ Months Ago

Looks like you fixed it to me.....
  • mindfullsilence
  • Professor
  • Professor
  • User avatar
  • Posts: 854

Post 3+ Months Ago

Same here, looks like it's working just fine. However, if you're ever interested in using a quicker way than writing it yourself, try out the superfish jquery plugin.

Post Information

  • Total Posts in this topic: 3 posts
  • Users browsing this forum: No registered users and 25 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.