menu different on pages

Forums    Joomla Templates Club    JA Ruby    menu different on pages
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • cjmicro Friend
    June 20, 2009 at 9:42 pm #142100

    I have Ruby installed, and using moomenu. I changed the CSS because I don’t want the transparency. Rather I don’t really mind it but I didn’t like it the way it was, because the text of the menu items was too light.

    In any case, I removed the transparency and the menu on the home page seems fine, but sometimes on other pages (in IE7) it seems to display behind the content items/tables/headines, etc. In Firefox this does not seem to be a problem.

    Home page: http://www.waredaca.com
    Other pages, http://www.waredaca.com/index.php?option=com_content&view=category&id=27&Itemid=74 is a good example.

    Can anyone help me fix this? I will paste my moomenu and menu css below:

    template css:

    /* MAIN NAVIGATION
    --------------------------------------------------------- */
    #ja-mainnav {
    width: 100%;
    background: #A1040B;
    position: absolute;
    z-index: 9999;
    top: 390px;
    right: 0;
    height: 25px;
    }

    #ja-mainnav li {
    margin: 0;
    padding: 0;
    float: left;
    display: block;
    background: none;
    cursor: pointer;
    }

    #ja-subnav {}

    #ja-subnav li a {
    text-decoration: none;
    padding: 0px;
    text-transform: none;
    font-size: 11px;
    font-weight: bold;
    }

    /* Default Joomla! Menu */
    ul.menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
    }

    ul.menu li {
    background: none;
    border-bottom: 1px solid #E5E5E5;
    display: block;
    margin: 0;
    padding: 0;
    line-height: normal;
    }

    ul.menu li a {
    background: url(../images/arrow.gif) no-repeat 0px 10px;
    display: block;
    outline: none;
    padding: 5px 0;
    margin: 0;
    text-decoration: none;
    color: #4F4F4F;
    }

    ul.menu li a:hover,
    ul.menu li a:active,
    ul.menu li a:focus {
    background: url(../images/arrow-hover.gif) no-repeat 0px 10px;
    color: #7786A2;
    text-decoration: none;
    }

    ul.menu li.active a {
    font-weight: bold;
    color: #7786A2;
    }

    ul.menu li ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
    }

    ul.menu li li {
    border: none;
    background: none !important;
    padding: 0 0 0 10px;
    }

    ul.menu li li a {
    background: url(../images/arrow.gif) no-repeat 0px 8px;
    color: #4F4F4F !important;
    border: none;
    padding: 5px 5px 5px 10px !important;
    text-transform: none;
    font-weight: normal !important;
    }

    ul.menu li li a:hover,
    ul.menu li li a:active,
    ul.menu li li a:focus {
    background: url(../images/arrow2.gif) no-repeat 0px 8px;
    color: #7786A2 !important;
    text-decoration: underline;
    }

    ul.menu li li.active a {
    color: #7786A2;
    font-weight: bold !important;
    }

    ul.menu li li li a {
    color: #4F4F4F !important;
    font-weight: normal !important;
    padding-left: 35px !important;
    background: url(../images/bullet.gif) no-repeat 25px 10px !important;
    }

    ul.menu li li li.active a {
    font-weight: bold !important;
    }

    Moomenu css:

    #ja-cssmenu {
    margin: 0; /* all lists */
    padding: 0;
    }

    #ja-cssmenu ul {
    margin: 0; /* all lists */
    padding: 0;
    }

    #ja-cssmenu li {
    float: left;
    display: block;
    padding: 0;
    margin: 0;
    background: none;
    }

    #ja-cssmenu li ul {
    width: 17.4em;
    position: absolute; /* second-level lists */
    z-index: 99;
    left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
    height: auto;
    width: 16.9em;
    }

    #ja-cssmenu li ul ul {
    margin: -2em 0 0 15em; /* third-and-above-level lists */
    }

    #ja-cssmenu li li {
    padding: 0 1em 0 0;
    margin: 0;
    width: 15.9em;
    }

    #ja-cssmenu ul a {
    width: 15.8em;
    width: 11.8em;
    }

    #ja-cssmenu li:hover ul ul, #ja-cssmenu li:hover ul ul ul,
    #ja-cssmenu li.sfhover ul ul, #ja-cssmenu li.havechildsfhover ul ul, #ja-cssmenu li.havechild-activesfhover ul ul, #ja-cssmenu li.activesfhover ul ul,
    #ja-cssmenu li.sfhover ul ul ul, #ja-cssmenu li.havechildsfhover ul ul ul, #ja-cssmenu li.havechild-activesfhover ul ul ul, #ja-cssmenu li.activesfhover ul ul ul {
    left: -999em;
    }

    /* This "unhides" the sub-menus (left: -999em is what hides them) */
    #ja-cssmenu li:hover ul, #ja-cssmenu li li:hover ul, #ja-cssmenu li li li:hover ul,
    #ja-cssmenu li.sfhover ul, #ja-cssmenu li.havechildsfhover ul, #ja-cssmenu li.havechild-activesfhover ul, #ja-cssmenu li.activesfhover ul,
    #ja-cssmenu li li.sfhover ul, #ja-cssmenu li li.havesubchildsfhover ul, #ja-cssmenu li li.havesubchild-activesfhover ul, #ja-cssmenu li li.activesfhover ul,
    #ja-cssmenu li li li.sfhover ul, #ja-cssmenu li li li.havesubchildsfhover ul, #ja-cssmenu li li li.havesubchild-activesfhover ul, #ja-cssmenu li li li.activesfhover ul {
    left: auto;
    }

    /* STYLING THE MENU
    -----------------------------------*/
    /* 1st level */
    #ja-cssmenu li a {
    display: block;
    text-decoration: none;
    font-size: 110%;
    color: #DBDBDB;
    padding: 3px 15px;
    text-transform: uppercase;

    }

    #ja-cssmenu li a:hover,
    #ja-cssmenu li a:active,
    #ja-cssmenu li a:focus {

    color: #FFFFFF;
    background: #BA050D;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    #ja-cssmenu li.havechild:hover a,
    #ja-cssmenu li.sfhover a,
    #ja-cssmenu li.havechildsfhover a,
    #ja-cssmenu li.havechild-activesfhover a {
    color: #FFFFFF;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    }

    #ja-cssmenu li.havechild a:hover,
    #ja-cssmenu li.haverchild li a:hover {
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    }

    #ja-cssmenu li.active {
    background: none;
    }

    #ja-cssmenu li.active a {
    color: #FFFFFF;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    #ja-cssmenu li a.active:hover,
    #ja-cssmenu li a.active:active,
    #ja-cssmenu li a.active:focus {
    color: #FFFFFF;
    }

    /* 2nd level and above */
    #ja-cssmenu li ul {
    border: 1px solid #202020;
    background: #E8E8E8}

    #ja-cssmenu li ul ul {
    border: 1px solid #202020;
    }

    #ja-cssmenu li ul li {
    border-bottom: 1px solid #202020;
    border-right: none;
    background: none;
    }

    #ja-cssmenu li ul a {
    border-right: none;
    margin: 0;
    padding: 5px 10px;
    background: none !important;
    text-transform: none;
    font-weight: normal;
    font-size: 100%;
    white-space: nowrap;
    color: #505050 !important;
    }

    #ja-cssmenu li.havesubchild,
    #ja-cssmenu li.havesubchild-active {
    background: url(img/arrow-1.gif) no-repeat 95% 50%;
    }

    #ja-cssmenu li ul a:hover,
    #ja-cssmenu li ul a:active,
    #ja-cssmenu li ul a:focus,
    #ja-cssmenu ul li:hover,
    #ja-cssmenu ul li.sfhover,
    #ja-cssmenu ul li.havesubchildsfhover,
    #ja-cssmenu ul li.havesubchild-activesfhover,
    #ja-cssmenu ul ul li:hover,
    #ja-cssmenu ul ul li.sfhover,
    #ja-cssmenu ul ul li.havesubchildsfhover,
    #ja-cssmenu ul ul li.havesubchild-activesfhover {
    background: #393939;
    color: #FFFFFF !important;
    }

    #ja-cssmenu ul li.sfhover a,
    #ja-cssmenu ul li.havesubchildsfhover a,
    #ja-cssmenu ul li.havesubchild-activesfhover a,
    #ja-cssmenu ul ul li:hover a,
    #ja-cssmenu ul ul li.sfhover a,
    #ja-cssmenu ul ul li.havesubchildsfhover a,
    #ja-cssmenu ul ul li.havesubchild-activesfhover a{
    background: #789ABD;
    color: #FFFFFF !important;
    }

    #ja-cssmenu ul li a.active {
    background: none !important;
    color: #393939 !important;
    font-weight: bold !important;
    }

    #ja-cssmenu ul li a.active:hover,
    #ja-cssmenu ul li a.active:active,
    #ja-cssmenu ul li a.active:focus {
    color: #FFFFFF !important;
    }

    I must have botched something up!

    Thanks
    Cheryl

    John Wesley Brett Moderator
    November 8, 2009 at 9:45 pm #322969

    Is this still an issue. Everything seems to be fine at the moment.
    Both menus look the same.

    John.

    1 user says Thank You to John Wesley Brett for this useful post

    1. cjmicro
    cjmicro Friend
    November 8, 2009 at 11:36 pm #322977

    Wow, thanks for the reply, but yes I think everything is fine!

    Cheryl

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)

This topic contains 3 replies, has 2 voices, and was last updated by  cjmicro 15 years ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories