How to make Page Menu buttons' color different from menu the bar?
 

Can someone help me with this please? Atahualpa let's you change the menu (page) color, but unfortunately it colors the whole bar that color as well under ATO/Header Area/Menu 1. Is there any way to make the menu buttons color different from the rest of the menu bar....say on the right?

http://img.villagephotos.com/p/2005-...atahualpa6.jpg




Here is my html/css for the menu so far, what do I need to add to change it?

/* Menu Bars */


/* Adjustments for the menu bars, which in their default
state have 1px borders plus -1px margins to avoid 1+1=2px
borders between neighbor items. */
ul.rMenu-hor ul, ul.rMenu-hRight ul { margin-top: 0px; }
ul.rMenu-hor li { margin-bottom: 0px; margin-top: 0px; margin-left: 0px; }
ul.rMenu-hor { padding-left: 0px; }
ul.rMenu-ver li { margin-top: 0xp; }

div#menu1 ul.rMenu li a, div#menu2 ul.rMenu li a {
padding: 8px 10px;
}
/* different padding for parents with arrow image */
div#menu1 ul.rMenu li.rMenu-expand a, div#menu2 ul.rMenu li.rMenu-expand a {
padding: 8px 22px 8px 10px !important;
background-position: 97% 50% !important;
}
/* less padding for children with arrow image */
div#menu1 ul.rMenu li.rMenu-expand li a, div#menu2 ul.rMenu li.rMenu-expand li a {
padding: 5px 22px 5px 10px !important;
background-position: 97% 50% !important;
}

/* Space between items of page menu bar */
div#menu1 ul.rMenu li a {
margin-right: 0;
padding-right: 12px;
padding-left: 12px;
}

/*
ul#rmenu {
padding:5px;
}
*/
div#menu2 {
background: #666666;
}
div#menu1 {
background: #eee;
}

Try using a transparent background on the last two items. That may get you going in the right direction.

Hi, I am struggling with a similar problem, only with a drop-down sub-page menu. I have read and tried a few different things based on diff threads I have found on this forum.

I can't seem to get it so that the top level tab (i.e. 'design services') is pink (active) but so that the drop down list has the pale grey background and turns pink on hover. Without any custom coding the drop down menu is a solid pink block.

URL for the page in question:
http://www.beagleybrown.com/design-services/

I have tried adding various different things in the CSS inserts area, such as:
body.page-id-74 li.rMenu-expand a:link {background: transparent !important;}
body.page-id-74 li.rMenu-expand a:visited {background: transparent !important;}
body.page-id-74 li.rMenu-expand a:hover {background: #cccccc !important;}
body.page-id-74 li.rMenu-expand a:active {background: #ec008c !important;}

I have tried the above:
- with div#menu1 infront of the li
- without the specific page-id
- with rMenu-ver instead of expand

Any help would be greatly appreciated. I'm running Atahualpa 3.4.9.