Results 1 to 1 of 1

Thread: Need help with Drop Down Menu on Joomla template

  1. #1
    Join Date
    May 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Need help with Drop Down Menu on Joomla template

    Hello,

    I am using All levels menu generator from: http://www.dynamicdrive.com/dynamici.../generator.htm in my sites.

    I followed the guide just the way it says on the tutorial and got it running smooth, please see it at: http://www.eaglesuccess.com/stfrancisxavier/

    But then, when I tried using it at my Joomla site, it does not give me the results I would like to see.

    The problem is that when I place the mouse over the drop down menu, the links on the drop down list are somehow aligned to the center, but my desire is to have them aligned to the left side like my other page.

    The CSS code that controls the menu is as follows:

    ddlevelsmenu-topbar.css

    Code:
    .solidblockmenu ul{
    margin: 0;
    padding: 0;
    float: left;
    font: bold 13px Arial;
    width: 100%;
    overflow: hidden;
    margin-bottom: 1em;
    border: 1px solid #625e00;
    border-width: 1px 0;
    background: black url(blockdefault.gif) center center repeat-x;
    }
    
    .solidblockmenu li{
    display: inline;
    }
    
    .solidblockmenu li a{
    float: left;
    color: white;
    padding: 9px 11px;
    text-decoration: none;
    border-right: 1px solid white;
    }
    
    .solidblockmenu li a:visited{
    color: white;
    }
    
    .solidblockmenu li a:hover, .solidblockmenu li a.selected{
    color: white;
    background: transparent url(blockactive.gif) center center repeat-x;
    }

    __________

    ddlevelsmenu-base.css

    Code:
    /* ######### Drop Down ULs CSS ######### */
    
    
    .ddsubmenustyle, .ddsubmenustyle ul{ /*topmost and sub ULs, respectively*/
    font: normal 13px Verdana;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    list-style-type: none;
    background: white;
    border: 1px solid black;
    border-bottom-width: 0;
    visibility: hidden;
    z-index: 100;
    }
    
    .ddsubmenustyle li a{
    display: block;
    width: 160px; /*width of menu (not including side paddings)*/
    color: black;
    background-color: lightyellow;
    text-decoration: none;
    padding: 4px 5px;
    border-bottom: 1px solid black;
    }
    
    * html .ddsubmenustyle li{ /*IE6 CSS hack*/
    display: inline-block;
    width: 170px; /*width of menu (include side paddings of LI A*/
    }
    
    .ddsubmenustyle li a:hover{
    background-color: black;
    color: white;
    }
    
    /* ######### Neutral CSS  ######### */
    
    .downarrowpointer{ /*CSS for "down" arrow image added to top menu items*/
    padding-left: 4px;
    border: 0;
    }
    
    .rightarrowpointer{ /*CSS for "right" arrow image added to drop down menu items*/
    position: absolute;
    padding-top: 3px;
    left: 100px;
    border: 0;
    }
    
    .ddiframeshim{
    position: absolute;
    z-index: 500;
    background: transparent;
    border-width: 0;
    width: 0;
    height: 0;
    display: block;
    }
    What changes should I make on these codes so I can have the links in the drop down menu align to the left when placing the mouse over it?

    Thanks in advance,
    4Real
    Last edited by Forreal; 05-10-2009 at 09:07 PM.

Tags for this Thread

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
  •