Results 1 to 7 of 7

Thread: AnyLink CSS Menu v2.2 Problem in IE7

  1. #1
    Join Date
    Jun 2006
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default AnyLink CSS Menu v2.2 Problem in IE7

    1) Script Title: AnyLink CSS Menu v2.2


    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...anylinkcss.htm

    3) Describe problem: I'm using 4 parent text links each with their own drop down. If you mouse over each link (across the nav bar), they don't disappear, they stack on top of each other horizontally. If you mouse up or down pass the flyout, they disappear as they should. It also works fine in FireFox.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Please post a link to a page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jun 2006
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    I'm sorry

    Forgot the link...

    http://vigsdesign.com/test/Sample.htm

  4. #4
    Join Date
    Jun 2006
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Any with this please ?

  5. #5
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Dropping the table and using a div instead helps in my browser. When i change this part of your code like this:
    Code:
    <style type="text/css">
    <!--
    .style1 {color: #999999}
    #menu{color: #999999; background: url(images/nav_bkgrd_new.jpg); border:none; width:920px; margin:0 auto; height:30px } 
    -->
    </style>
    </head><body>
      
     <!--3rd anchor link and menu -->                        
    
     <div id="menu">
    
        &nbsp;&nbsp;<a href="http://www.dynamicdrive.com/" 
    class="anchorclass" rel="submenu1" style="text-decoration: none;"><font 
    size="2"><font color="#ffffff"><strong>Link 1</strong></font></font></a><font
     size="2"><strong><font size="2"><font color="#ffffff">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     |&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  
                  <a href="http://www.dynamicdrive.com/" class="anchorclass"
     rel="submenu2" style="text-decoration: none;"><font size="2"><font 
    color="#ffffff">Link 2</font></font></a><font size="2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     | &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  
    <a href="http://www.dynamicdrive.com/" class="anchorclass" 
    rel="submenu3" style="text-decoration: none;"><font color="#ffffff"><font
     size="2">Link 3</font></font></a><font color="#ffffff">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
     | &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                  
    <a href="http://www.dynamicdrive.com/" class="anchorclass" 
    rel="submenu4" style="text-decoration: none;"><font color="#ffffff"><font
     size="2">Link 4</font></font></a><font color="#ffffff"></font></font>
                  
        </font></font></font></strong></font>
        
    </div><!--end #menu-->
    it works i IE too. You can change the css to fit your needs. I suggest you take away all the inline styles and &nbsp; if you can, and make the changes in a stylesheet.

  6. #6
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Here is an example of what i mean. This will give you about the same look but the code is easier to understand ( in my opinoin)

    Code:
    <style type="text/css">
    #menu{
    	color: #FFFFFF; 
    	background: url(images/nav_bkgrd_new.jpg);  
    	border:none; 
    	width:920px; 
    	margin:0 auto; 
    	padding-top:4px; 
    	padding-bottom:4px;
    }
    a.anchorclass{
    	color: #FFFFFF; 
    	font-weight:bold; 
    	font-size: 0.8em; 
    	text-decoration:none; 
    	border:none;	
    	padding-right:28px;	
    	padding-left:28px;
    }
    a.anchorclass:hover {
    	color: #3CF; 
    }
    </style>
    </head>
    <body> 
     
    <div id="menu">
    
    <a href="http://www.dynamicdrive.com/" class="anchorclass" rel="submenu1">Link 1</a> | 
                  
    <a href="http://www.dynamicdrive.com/" class="anchorclass" rel="submenu2">Link 2</a> | 
                  
    <a href="http://www.dynamicdrive.com/" class="anchorclass" rel="submenu3">Link 3</a> |
                  
    <a href="http://www.dynamicdrive.com/" class="anchorclass" rel="submenu4">Link 4</a>       
        
    </div><!--end #menu-->

  7. The Following User Says Thank You to azoomer For This Useful Post:

    mackula (06-25-2010)

  8. #7
    Join Date
    Jun 2006
    Posts
    8
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    azoomer,

    Thank you so much, works like a charm :-)

    mack

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •