Page 2 of 2

Re: 'ellnav-vert' menu problem

Posted: Tue May 09, 2006 12:22 pm
by Dr.CSS
paste the code of the rendered page then tell me what color you want for what page.

  mark

Re: 'ellnav-vert' menu problem

Posted: Wed May 10, 2006 2:59 am
by chipus
hi Mark,

The attachment below is the rendered page

The color of the menu is ok now.

As i said, i'd like to have:
      The current page will become RED
      If the current page have no children, then its parent will have the color RED

What should i do with my stylesheet then

Thx a lot , mark



[attachment deleted by admin]

Re: 'ellnav-vert' menu problem

Posted: Wed May 10, 2006 4:02 am
by Dr.CSS
when you post back paste the code of the rendered page into this edit window, then tell me what color you want for what page.
like so,,, 99.9% of this is the CSS for the menu here www.bluoakom.com/ that menu has class' and a class'as you will see very handy for styling every last thing,,, here goes,,

/* LINKS */
        #contenthead
a,
a:link
a:active, a:visited {color: #222;
text-decoration: none;background-color:#6F8C5A;
}
        #contenthead
        a:hover {color: #fff;
text-decoration: underline;background:#6F8C5A;
}
        .breadcrumbs
a,
a:link
a:active, a:visited {color: #222;
text-decoration: none;background-color:none;
}
        .breadcrumbs
        a:hover {color: #fff;
text-decoration: underline;background:#6F8C5A;
}
        #flat
a,
a:link
a:active, a:visited {color: #3981FE;
text-decoration: none;background:#FFF;
}
        #flat
        a:hover {color: #595959;
text-decoration: underline;background:#FFF;
}
        .NewsSummary
a,
a:link
a:active, a:visited {color: #3981FE;
text-decoration: none;
}
        .NewsSummary
        a:hover {color: #595959;
text-decoration: underline;
}

#main a,
a:link
a:active, a:visited {color: #595959;
text-decoration: underline;background:#FFF;
}
#main a:hover {color: #595959;
text-decoration: none;background:#FFF;
}

        #menu #a15
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none;background: #9FC2FE ;
}
        #menu #a31
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none;background: #9FC2FE ;
}
        #menu #a19
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none; background-image: url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a24
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none;background: #9FC2FE;
}
        #menu #a25
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none;background: #9FC2FE;
}
        #menu #a32
        a,
a:link
a:active, a:visited {color: #595959;
text-decoration: none;background: #9FC2FE;
}
        #menu #a34
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a13
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a35
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a22
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a17
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a36
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a38
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background:#d19052;
        }
        #menu #a43
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #8bccf0 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
        }

        #menu #a44
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #8bccf0 ;
}
        #menu #a45
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #8bccf0 ;
}
        #menu #a46
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #8bccf0 ;
}
        #menu #a42
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #955300 ;
}
        #menu #a40
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #a4a6ed ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a41
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #a4a6ed ;
}
        #menu #a37
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #2a8c92 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a33
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #2a8c92 ;
}
        #menu #a30
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #9FC2FE ;
}
        #menu #a47
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a48
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}
        #menu #a49
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a50
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}
        #menu #a51
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}
        #menu #a52
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}
        #menu #a53
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #9FC2FE ;
}
        #menu #a39
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #9FC2FE ;
}
        #menu #a59
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}
        #menu #a58
        a,
a:link
a:active, a:visited {color: #000;
text-decoration: none;background: #AEB0B2 ;
}

        /* Hover */
#menu #a15
        :hover {
        color: #FFF;
text-decoration: underline;
        background: #9FC2FE ;
}
        #menu #a31
        :hover {
        color: #FFF;
text-decoration: underline;
        background: #9FC2FE ;
}
        #menu #a19
        :hover {
        color: #FFF;
text-decoration: none;
        background: #9FC2FE ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a24
        :hover {
        color: #FFF;
text-decoration: underline;
        background: #9FC2FE ;
}
        #menu #a25
        :hover {
        color: #FFF;
text-decoration: underline;
        background: #9FC2FE ;
}
        #menu #a32
        :hover {
        color: #FFF;
text-decoration: underline;
        background: #9FC2FE ;
}
        #menu #a34
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a22
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b ;
}
        #menu #a17
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b ;
}
        #menu #a13
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b ;
}
        #menu #a35
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b;
}
        #menu #a36
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b ;
}
        #menu #a38
        :hover {
        color: #FFF;
text-decoration: none;
        background: #b56e2b;
}
        #menu #a43
        :hover {
        color: #FFF;
text-decoration: none;
        background: #64a7e8 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a44
        :hover {
        color: #FFF;
text-decoration: none;
        background: #64a7e8 ;
}
        #menu #a45
        :hover {
        color: #FFF;
text-decoration: none;
        background: #64a7e8 ;
}
        #menu #a46
        :hover {
        color: #FFF;
text-decoration: none;
        background: #64a7e8 ;
}
        #menu #a42
        :hover {
        color: #FFF;
text-decoration: none;
        background: #6b3d00 ;
}
        #menu #a40
        :hover {
        color: #FFF;
text-decoration: none;
        background: #6970db ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a41
        :hover {
        color: #FFF;
text-decoration: none;
        background: #6970db ;
}
        #menu #a37
        :hover {
        color: #FFF;
text-decoration: none;
        background: #257A7E ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a33
        :hover {
        color: #FFF;
text-decoration: none;
        background: #257A7E ;
}
        #menu #a30
        :hover {
        color: #FFF;
text-decoration: none;
        background: #9FC2FE ;
}
        #menu #a47
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a48
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a49
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
        background-image:url(modules/MenuManager/images/arrow.gif);
background-position: center right;
background-repeat: no-repeat;
}
        #menu #a50
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a51
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a52
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a58
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a59
        :hover {
        color: #FFF;
text-decoration: none;
        background: #939598 ;
}
        #menu #a53
        :hover {
        color: #FFF;
text-decoration: none;
        background: #9FC2FE;
}
        #menu #a39
        :hover {
        color: #FFF;
text-decoration: none;
        background: #9FC2FE ;
}

/* END LINKS */

think it's long enuf? yea it's one CSS called "Links" all the #a39 are made by making your own menu in  Layout » Menu Manager second tab 'File Templates' clik the dbl. paper icon left hand side, it will ask you to name it 'something' 'submit' it goes to the first tab now you can edit it CSS/Template style, every where you see id}" id}" you get of course <a id="a39" and <li id="a39" with those you can style away, warnig once you start you have to go all the way, if you have a long menu,, parents and kids just keep giving colors away,

  mark