trq Posted September 2, 2008 Share Posted September 2, 2008 Alright, first up, Im not at all a designer. I paid a designer to do most of this site for me but now Im trying to impliment the menu and Im a little stuck. Im using a jQuery implimentation of the suckerfish dropdowns. The problem appears to be however that the dropdowns are falling behind another layer and I can't for the life of me figure out how to get them to show above the main conent. The site is previewable here http://thorpesystems.com:8080 This here is the relevent css. /* MAIN MENU --------------------------------------------------------------------------- */ #menu { margin: 0; padding: 0; float: right; border-right: 1px solid #fff; } #menu li { margin: 0; padding: 0; list-style: none; float: left; display: block; border-left: 1px solid #fff; } #menu li a { display: block; padding: 0 8px 0 8px; height: 38px; line-height: 38px; background: url(../images/arrow.gif) bottom right no-repeat; color: #fff; text-decoration: none; } /* Navigation */ .nav, .nav ul { list-style: none; margin: 0; padding: 0; } .nav { font-family: Arial, Helvetica, sans-serif; z-index: 100; position: relative; } .nav li { border-left: 1px solid #000; float: left; margin: 0; padding: 0; position: relative; .nav li a, .nav li a:link, .nav li a:active, .nav li a:visited { font: bold 1.22em/25px Arial, Helvetica, sans-serif; background: #565656; color: #959595; display: block; padding: 0 9px; text-transform: lowercase; text-decoration: none; } .nav li a:hover { background: #ccc; color: #000; } #nav-one li:hover a, #nav-one li.sfHover a { background: #ccc; color: #000; } #nav-one li:hover ul a, #nav-one li.sfHover ul a { background: #565656; color: #959595; } #nav-one li:hover ul a:hover, #nav-one li.sfHover ul a:hover { background: #ccc; color: #000; } .nav ul { background: #565656; border-bottom: 1px solid #000; list-style: none; margin: 0; width: 100px; position: absolute; top: -999em; left: -1px; } .nav li:hover ul, .nav li.sfHover ul { top: 25px; } .nav ul li { border: 0; float: none; } .nav ul a { border: 1px solid #000; border-bottom: 0; padding-right: 20px; width: 80px; white-space: nowrap; } .nav ul a:hover { background: #ccc; color: #000; } Anyone want to help me out? Quote Link to comment https://forums.phpfreaks.com/topic/122458-solved-hidden-jquery-suckerfish/ Share on other sites More sharing options...
AndyB Posted September 2, 2008 Share Posted September 2, 2008 Looking at it with either Firefox2 or IE6 on a PC, it's hard to reconcile your problem description with what I see. Quote Link to comment https://forums.phpfreaks.com/topic/122458-solved-hidden-jquery-suckerfish/#findComment-632334 Share on other sites More sharing options...
trq Posted September 2, 2008 Author Share Posted September 2, 2008 I'm looking at it with iceweasel 3.0 (firefox) and the dropdowns are definately hidden below another layer. Quote Link to comment https://forums.phpfreaks.com/topic/122458-solved-hidden-jquery-suckerfish/#findComment-632335 Share on other sites More sharing options...
trq Posted September 2, 2008 Author Share Posted September 2, 2008 Aha! Just found another div #top. Made its overflow visable and whola! Thanks anyways. Quote Link to comment https://forums.phpfreaks.com/topic/122458-solved-hidden-jquery-suckerfish/#findComment-632337 Share on other sites More sharing options...
AndyB Posted September 2, 2008 Share Posted September 2, 2008 FYI, now it works (as expected) with FF2 and IE6 Quote Link to comment https://forums.phpfreaks.com/topic/122458-solved-hidden-jquery-suckerfish/#findComment-632339 Share on other sites More sharing options...
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.