seperators in css menu

Did you add the # hyperlink as I suggested?

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Excellent Dave!

(I didn’t really understand what you meant at first).


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Oops! Spoke too soon. :slight_smile:

I have a second cssmenu on some pages (client pages) which has different colours and of course this is altered by the code too. I’d like to be able to set the colours for this cssmenu separately, so that it works in the same way, but with the correct colours.

What do I need to add so that the code only affects one specific item on the page?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

What do I need to add so that the code only affects one specific item on the page?

Which page and which item/s and hopefully I can provide specific code.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave.

The css-menus are on every page. On the standard pages they are called ‘menus’ and on the client pages (which aren’t visible on the normal site) they are called ‘c-menu’.

I have 4 master pages and would ideally want to place the code there.

(I spent an hour or so trying to find how to do this and fudge it myself … but I couldn’t manage to make it item specific :frowning: )


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Without being able to see a specific page I cant give you specific code.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

So … after much to’ing and fro’ing with Dave offline (because of dealing with private client pages) and after much failing to understand what Dave was doing and how, or why, it was working … Dave has very generously produced some very neat code that addresses this limitation with the CSSMenus Action. In other words:

How to have blank spacers/dividers with a vertical cssmenu.

(It also works with/addresses sub-menus).

N.B. If you have more than one cssmenu, then you add it as Container2 etc. Below is the code for my specific cssmenu Action setup, with the colours as I’ve set them, so you would need to changes these colours to suit your own setup.

(You can see how it looks on www.grantsymon.com)

/* Code for Daves Menu separtors spacers /
div.fwNavContainer1 a[href=“#nil”], div.fwNavContainer1 a:hover[href=“#nil”] {
color:#000000 !important;
text-decoration:none !important;
background: #000000 !important;
}
div.fwNavContainer1 a.fwCurrent {
color:#110E1C !important;
text-decoration:none !important;
background: #6C6C6C !important;
}
div.fwNavContainer1 a.fwCurrent:hover {
color: black !important;
text-decoration: none !important;
background: #B1B1B1 !important;
}
/
End of code for Daves Menu separtors spacers */


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Oops! Lost the formatting. I don’t know how to keep the code more readable I’m afraid.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

*Grant. Where is the example please? At http://www.grantsymon.com there is a black page only…


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Oops again …

The media folder got lost between test and final update. All good now.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And the readable version

/* Code from here for Daves Menu separators spacers */

div.fwNavContainer1 a[href="#nil"], div.fwNavContainer1 a:hover[href="#nil"] {
color:#000000 !important;
text-decoration:none !important;
background: #000000 !important;
}
div.fwNavContainer1 a.fwCurrent {
color:#110E1C !important;
text-decoration:none !important;
background: #6C6C6C !important;
}
div.fwNavContainer1 a.fwCurrent:hover {
color: black !important;
text-decoration: none !important;
background: #B1B1B1 !important;
}
div.fwNavContainer2 a[href="#nil"], div.fwNavContainer2 a:hover[href="#nil"] {
color:#D1D1D1 !important;
text-decoration:none !important;
background: #424353 !important;
}
div.fwNavContainer2 a.fwCurrent {
color: #110E1C !important;
background: #6C6677 !important;
text-decoration:none !important;
}
div.fwNavContainer2 a.fwCurrent:hover {
color: black !important;
text-decoration: none !important;
background: #868686 !important;
}

/* End of added code for Daves Menu separators spacers */

The reason this is necessary if you use a line return as a menu separator is because the CSS menu action gives every list item (line) an href attribute of #nil unless you specifically assign a link to it.

And because it has an href attribute it is treated as a standard link and takes on the styling of the rest of the links. Hence a blank line has a hover attribute if you have set one for the rest of the links.

Now if you dont use blank lines in your vertical CSS menu to space your items then this is not something you will ever need to concern yourself with and should be classed as a ‘special use case’

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I should also add … that cssmenu submenus are given a #nil link by FW. So for Dave’s code to work correctly on these, you must give them a # link (which means Dave’s code doesn’t alter their formatting).


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options