Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Member
    Join Date
    Nov 2002
    Posts
    97
    Member #
    278
    I have a site that is using the suckerfish style dropdown and I seem to have a wierd bug happening. On a previous version I had the li dropdown block entirely clickable, so a user could click in any part of the 160px block, but on a current site using the same navigation just dropped in you can only click on the word and nothing happens for the rest of the 'box'..

    Here is the CSS for that section:
    Code:
     /*******************************/
    	/*   BEGIN: Drop-Down Styles   */
    	/*******************************/
    	
    	#navigation, #navigation ul {
    		position:absolute;
    		padding: 0;
    		margin: 0;
    		list-style: none;
    		line-height: 20px;
    		font-size: 11px;
    		font-family: Arial, Helvetica, sans-serif;
    		z-index: 10;
    		font-weight: bold;
    	}
    	#navigation li.main {
    		text-align: center;
    		}
    	
    	#navigation ul {
    		margin: 0 0 0 -1px;
    	}
    	
    	#navigation a {
    		display: block;
    		background-color: transparent;
    		color: #F1F1F1;
    		text-decoration: none;
    		padding: 2px 4px 2px 6px;
    		z-index: 10;
    	}
    	
    	#navigation li {
    		float: left;
    		width: auto;
    		border: solid 1px #0f2344;
    		border-right: none;
    		background-color: #0f2344;
    		color: white;
    		z-index: 10;
    	}
    	
    	#navigation li li {
    		border-right: solid 1px black;
    		border-bottom: none;
    		width: 160px;
    	}
    	
    	#navigation li.last {
    		border-right: solid 1px black;
    		border-bottom: solid 1px black;
    	}
    	#navigation li.hr {
    		border-right: solid 1px black;
    		border-bottom: solid 1px black;
    		
    	}
    	
    	#navigation li ul {
    		position: absolute;
    		width: 160px;
    		display: none;
    	}
    	
    	#navigation ul ul {
    		margin: -20px 0 0 160px;
    	}
    	
    	#navigation li:hover ul ul, #navigation li.over ul ul, #navigation li.over ul ul, #navigation li.over ul ul ul {
    		display: none;
    	}
    	
    	#navigation li:hover ul, #navigation li li:hover ul, #navigation li.over ul, #navigation li li.over ul, #navigation li li li.over ul  {
    		display: block;
    	}
    	
    	#navigation li:hover, #navigation li.over {
    		color: black;
    		background-color: #467BB4;
    		cursor: pointer;
    	}
    			
    	#navigation li:hover>a { /* IE/Win ignores this declaraion */
    		color: black;
    		background-color: #467BB4;
    	}
    And a segment of the HTML I'm using.

    Code:
    <ul id="navigation">
    			<li><a href="http://links.com">Home <img src="http://links.com/comm_demo3/img/dn_arrow.gif" alt="" border="0"></a>
    			  <ul>
    			    <li><a href="http://links.com/comm_demo3/pages/news/news.asp">Newsroom</a>
    				<li><a href="http://links.com/comm_demo3/pages/news/archives/archives.asp">Newsletter Archives</a>
    				<li class="last"><a href="http://links.com/dashboard/corporat.htm">Dashboard</a>
    				</li>
    		      </ul>
    			</li>

  2.  

  3. #2
    Member
    Join Date
    Nov 2002
    Posts
    97
    Member #
    278
    Might be in the js file.. I have no idea. Using a code check the CSS is identical?

  4. #3
    Member
    Join Date
    Nov 2002
    Posts
    97
    Member #
    278
    Anyone? Is my explaination not cutting it? I cannot find this mini flaw.

  5. #4
    Member
    Join Date
    Nov 2002
    Posts
    97
    Member #
    278
    * html #navigation li li a { height: 1%; }

    Fixes it..


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 02:40 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com