Rounded Edges for submenu items

I have a vertical menu with a submenu. The top level buttons have rounded edges. I cannot get the submenu buttons to show rounded edges. The submenu buttons have the color/text/state modifications working fine. It is the rounded edges I am having trouble getting to work.
User error or bug?
Thanks
Jim

Hi Jim
This should work but make sure while rounding the corner , Sub Menu Item is selected not the sub menu.
Thanks,
Sanjit

Similar Messages

How to add different background image for submenu items???

Hi all,
I'm pretty new to web design and CSS in particular. Here's my problem...
I've got a Spry horizontal menu bar (untouched as yet), and I want to have a different background image for my submenu items than that of my menu items. From searching the internet I think that I need to apply a class to the submenu item (please correct me if I am wrong).
How would I go about doing this and how would I assign the class to just the submenu items?
Also ideally I want to have my first and last menu items to have rounded corners on one side (therefore making a rounded edge menu bar), is it possible to have a different background image for individual menu items? If so, how?
Really appreciate any help!

Thanks for the link! I've managed to sort the background issue, and it seems to be working fine!
Just one little issue left to tackle...
I want my text to be centered in my top menu items BUT aligned left in my drop down menu items. I have managed this but the text hugs the left hand side. I've tried adding a little margin to the left but that doesn't seem to affect anything???
Here's my CSS... Any ideas which class I should be targeting or why adding the margin isn't working would save my tearing the rest of my hair out! thanks! (screenshot attached).
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - Revision: Spry Preview Release 1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    cursor: default;
    width: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    margin: 0;
    list-style-type: none;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 120px;
    float: left;
    height: 24px;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    background-repeat: repeat-x;
    background-color: #333333;
    background-image: url(../images/navbar_bg.jpg);
    border-right-width: 1px;
    border-left-width: 1px;
    border-right-style: solid;
    border-left-style: solid;
    border-right-color: #000000;
    border-left-color: #666666;
ul.MenuBarHorizontal li li
    list-style-type: none;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: auto;
    float: left;
    height: 24px;
    background-color: #333333;
    background-image: none;
    padding: 0;
    margin: 0;
    left: -1px;
ul.MenuBarHorizontal li li a
    list-style-type: none;
    position: relative;
    text-align: left;
    cursor: pointer;
    float: left;
    height: 24px;
    background-image: none;
    font-size: 12px;
    font-weight: normal;
    border: 0px 0 0;
    width: 120px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    margin: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 120px;
    position: absolute;
    left: -1000em;
    height: 24px;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position: absolute;
    height: 24px;
    width: 120px;
    margin-top: -5%;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal li a
    display: block;
    cursor: pointer;
    text-decoration: none;
    font-style: normal;
    text-transform: capitalize;
    text-align: center;
    white-space: normal;
    padding: 0px;
    height: 24px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 20px;
    margin: 0px;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal li a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-color: #000000;
    background-image: url(../images/navbar_bg_hover.jpg);
    background-repeat: repeat-x;
    line-height: 22px;
ul.MenuBarHorizontal li li a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-color: #000000;
    background-image: none;
    background-repeat: repeat-x;
    width: 120px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #FFFFFF;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-repeat: repeat-x;
    background-position: 95% 50%;
    background-color: #333333;
    background-image: url(../images/navbar_bg.jpg);
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: repeat-x;
    background-position: 95% 50%;
    background-color: #000000;
    background-image: url(../images/navbar_bg_hover.jpg);
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: left;

InDesign Keyboard Shortcut for Submenu Item

I am attempting to make a keyboard shortcut for a particular menu selection in InDesign CS5. Particularly, I want to select an Adobe PDF Preset
("PDF/X-1a:2001") from the submenu. However, when I try select this in Keyboard Shortcuts, all I get is "Define" .. which of couse will bring me to the presets window. I want to be able to select a preset and assign a keyboard shortcut (in this case F15).
Does anyone have suggestions on how this can be done? I tried various ways, but still can't select anything from that submenu.
Thanks.

Hey,
I agree with Cari! Using SHIFT while clicking on PDF preset name would speed up things! On the other hand, you can use scripting to define which export profile to use and choose destination folder. Great thing about the scripts is that you can assign custom shortcuts to them!
// Set PDF Preset name
var myPreset = "[PDF/X-1a:2001]";
// If not using CS5 or later, set this to: false
var usingCS5 = true;
/// --- DO NOT EDIT --- ///
if(app.documents.length)
    doExport();
else
    alert("No documents opened");
function doExport(){
    try{app.pdfExportPresets.item(myPreset).name}
    catch(_){
        alert("PDF Preset not found!\nPlease check name and try again!");
        exit();
    var myFile = (function(){
        var setFile = File.saveDialog ("PDF export based on " + myPreset + " ...", "PDF:*.pdf");
        if(setFile != null)
            return setFile;
        else
            return false;
    if(myFile != false){
        if(Boolean(usingCS5))
            app.activeDocument.asynchronousExportFile (ExportFormat.PDF_TYPE, myFile, false, myPreset);
        else
            app.activeDocument.exportFile (ExportFormat.PDF_TYPE, myFile, false, myPreset);
All you have to set is PDF preset name and you are good to go! Also, you can save this script with different names containing different presets name and assign different shortcuts to every one of them.
Hope that helps.
Marijan (tomaxxi)
http://indisnip.wordpress.com/
http://inditip.wordpress.com/
http://twitter.com/tomaxxi

Different widths for Spry Menu Submenu items

On the Customize this widget page for menus, a new style was
suggested for submenu items, to make some of them less wide. This
code below was suggested. How do we attach the new style to the
submenu items? Clicking on each submenu text that's open, and
applying the smaller style doesn't do it.
Here is the code:
ul.MySmallerSubMenu {
width: 4em;
ul.MySmallerSubMenu li
width: 100%;
ul.MySmallerSubMenu li a
width: 100%;
Diana

Lines 96-102 of nl3.css reads
a:active {
    color: #996600;
    font-size: 0.95em;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bolder;
This interferes with the menu item list. If you change or delete the font-size, all should be well.
Gramps

Selecting a submenu item with AS (or JS)

I'm trying to invoke a submenu item from a keystroke. The item does not appear in the "Keyboard Shortcuts..." dialog. I've looked everywhere and it's just not there. It's a plugin made by Mediawide that dynamically resizes objects and pages according you my preset specs.
So I decided to just write a GUI script to invoke the menu item and then assign a keystroke to the script. The script works fine when I invoke it from the finder but if I invoke the script from the ID scripts palette, it just flashes the Apple menu for a split second and that's it. That defeats the purpose of assigning a keycommand to it.
I think it may have something to do with the fact that it activates "System Events" which is an outside app.
Can anyone shed some light on this?
Below is the script and below that, a screenshot of the menu item.
activate application "Adobe InDesign CS4"
tell application "System Events"
          tell process "Adobe InDesign CS4"
                    tell menu bar 1
                              tell menu bar item "Window"
                                        pick
                                        tell menu 1
                                                  tell menu item "Dynamic Resize"
                                                            pick
                                                            tell menu 1
                                                                      pick menu item "Resize Document"
                                                            end tell
                                                  end tell
                                        end tell
                              end tell
                    end tell
          end tell
end tell

Thank you Dirk,
That's almost got me where I need to be. Your script to open the File Info menu works fine but unfortunately my changes broke it. (BTW, I notice That in your script you ID "File Information..." when the menu item is "File Info...". Is there a rule somewhere regarding menu item names?)
I changed the submenu item to "Window" and the itemByName to "Resize Document" but I'm still getting an error on line 5, probably because it's a submenu item as illustrated in the screenshot above. The structure is actually Main>Window>Dynamic Resize>Resize Document. I just don't know where to put the "Dynamic Resize" part of the menu structure in there.
Here's what I have
(function(){
var m = app.menus.itemByName("$ID/Main").submenus.itemByName("$ID/&Window");
// $.writeln(m.menuItems.everyItem().name);
var mi = m.menuItems.itemByName("$ID/Resize Document");
var a = mi.associatedMenuAction;
a.invoke();
Thanks
RR

Spry Menu-overlapping submenu items

Hello,
I am new to Dreamweaver. I created a horizontal spry menu and one of my items has a submenu which contains two items. When I look at the page in live view or preview it in a browser, the two submenu items overlap. How do I fix this? I have tried playng around with the margin values for "ul menubarHorizontal ul ul" but I do not see any changes. Please help me! Thank you so much!

No way of knowing without seeing a link to your page.

Acknowledgment for PO item contains quantity variance

hi friends,
My scenario is to create a Purchase Order on Client A and through the Output Control I need to create a Sales Order on Client B and send the Order Acknowledgement(ORDRSP) for the Corresponding Purchase Order.
Iam through upto creating a Sales Order but when iam trying to send the Acknowledgement using the Output Control
Iam getting an error :
Confirmation control key missing for PO item .
when I attach a Confirmation Control Key while Creating PO
It is giving an error :
Acknowledgment for PO item contains quantity variance
Please respond quickly.
Thanks in advance.
Ganga Prasad

Hi,
check both IDOC, the ORDERS and the ORDRSP, whether they contain the same quantity.
Maybe the SD-part is rounding up your order, e.g. you order 5 bottles of wine and the wine is only sold in 6 bottle packadges.
If you find my answer useful, please don't forget the reward.
Regards,
Juergen

Spacing of Spry Menu submenu items, and inserting background images

Hiya, need a bit of help, could someone possibly guide me with this?
I've created a Spry Menu in DW CS5 - so far, so good.. However I'm pretty new to CSS Styles so need pointers at what to change to get the result I need. I've created the spry menu, however the submenu dropdown items are not flush to the ones above, theres a 1px horz gap between each item and while it looks okay, its particularly visible in Firefox and Chrome and would prefer no spacing at all..
The live site is at http://www.ebm.co.uk/2011site/indexnavbar2.html
if you take a look at the drop down menu bar you'll see what i mean - what do I need to do to remove the spacing?
I also want to replace the solid colour with images, where do I specify the images for 1) top menu item 2) submenu item and 3) 'hover' item, and do I need to make any areas transparent?
Any advice would be much appreciated.. thanks!
Chris

This is a good place to start http://www.dwcourse.com/dreamweaver/ten-commandments-spry-menubars.php.
Also this might help http://labs.adobe.com/technologies/spry/samples/menubar/CenteringHorizontalMenuBarSample.h tml
Gramps

Rounding Profile for Transfer Order

Hello all,
I want to ask a question about the rounding profile for transfer order. I have a material number which has rounding profile for PO
from vendor.You can only order 60 packeges in carton.We have no problem here. The problem is after we get the order from vendor to DC we want to distribute to the store.Store create transfer order from DC with the same rounding profile.We want to transfer this item wiht the lower rounding profile from dc to store like 5 pieces minimum. If store want to create Transfer PO it has to create with 5 piece or multiple of 5.
How can I create new rounding rule for store without changing vendor rule. is that possible ?
thank you for your help..

In addition to the rounding rule in PO, you can maintain it for vendor master also. This would be specific to the vendors.
So for your store you can maintain a separate rounding rule, and create a PO. SO whenever PO is created an predefined rounding rule will get activated in the vendor master.

Rounding values for display

Hi all hope you can help.
I have a numeric DB column say 566785.8975. The value of the information in the column cant be changed. The application performs two functions data input for the owners and view for the customers.
Idealy I want to only display to two decimal points for the customers
I have tried using the the ROUND command with no success using source as a PL/SQL expression or function and a value of ROUND(GROSS,2) where GROSS is the column name
any ideas?
Thanks

Hi Bjorn - the problem with the TO_CHARing (having suggested it in the first place - sorry) is if you want to use automated row processing to update the page.
However, you could have an item (your gross_read_only) which is not linked to a DB column, and then all your automated fetches and updates would work fine.
You can set the value of this item using a SELECT statement within the item source, or a computation when the page is rendered.
In either case, SELECT just the read_only item (TO_CHAR it as described), and I see no reason why it shouldn't work.
In other words - for the item source:
SELECT to_char( GROSS, '999G999G999G999G990D00') GROSS_READ_ONLY
FROM TABLE
where ID = :P1_ID_ITEM
or in a PL/SQL item computation:
declare
l_value VARCHAR2(4000);
begin
select to_char(GROSS, 'FML999G999G999G999G990D00') into l_value
FROM TABLE
where ID = :P1_ID_ITEM;
return l_value;
(or :P1_READ_ONLY_ITEM := l_value in a page computation)
end;
Does this help?
John.

Rounded edges to a text field

Hi,
Does anyone know how do I make the edges of a text field to be roundod?
Also, I need to change the look of a scroll bar.
Should I use a L& F for that?
Thanks.

Does anyone know how do I make the edges of a text field to be roundod?This is not easy as far as I know.
Also, I need to change the look of a scroll bar.
Should I use a L& F for that?Yes, this is recommended. You can find many free and very good L&F's and some of them can have rounded edges of Textfields.
One of the best L&F freely available is [Substance L&F|https://substance.dev.java.net/]. Try it out.
Thanks!

Spry Menu submenu items jump when clicked

Here is the test site:
http://jboyerdesign.com/keepsake/
When you click on the submenu items, the menu jumps as if there is a different size defined for the text of the menu item as you click.
Any ideas?
I haven't edited the submenu CSS settings. I did change some things in the menu section:
ul.MenuBarHorizontal ul
          border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
          display: block;
          cursor: pointer;
          background-color: #EEE;
          padding: 0.5em 0.50em;
          color: #333;
          text-decoration: none;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
          background-color: #EEE;
          color: #A74343;
          padding: 0.5em 0.50em;
          text-decoration: none;
          font-weight: normal;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
          background-color: #EEE;
          color: #A74343;

Lines 96-102 of nl3.css reads
a:active {
    color: #996600;
    font-size: 0.95em;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bolder;
This interferes with the menu item list. If you change or delete the font-size, all should be well.
Gramps

SubMenu Item Transparency

works fine in FF of course with opacity:0.9;
but how and maybe the real question is where do i set the CSS
of the submenu items to be transparent for IE?

well... if the Idea is to have the background opaque and the
text solid, you will either have to Layer your content or cut a 1px
image that has the right opacity and repeat it across the
background of the nav items.
When you set something opaque, everything inside of it
follows suit.
So you could do something like:
<ul>
<li><span></span><a href="">some
link</a><li>
</ul>
Float the span set the opacity, width, height, background
color, etc. and use negative margins on the anchor to put the
anchor on top of the span.
I used that trick on Disney's ParentPedia site to create
"picture frames" over images. If you look at
http://family.go.com/parentpedia/
in the section that say's Most Recent Parenting Stories, you'll see
the user image. The image is actually being overlaid with a
transparent image on top.
The idea is the same... that's the only example I have right
now.

How to position spry submenu items ABOVE main horizontal menu

I am building a site for a new client. (Using DW CS4) I have
inserted a navigation bar using the spry nav widget, which I am
familiar with. However, what I am NOT familiar with is the
positioning of the submenu items. Normally, the default is fine.
However, where the bar is located - the client wants the
submenus to display above the main menu bar.
How do I accomplish this? I understand it will be in the CSS
somewhere, but unsure of as to where (and what) changes.
At the risk of jumbling up the post here, - here is the CSS:
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release
1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights
reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box
with no margin or padding */
ul.MenuBarHorizontal
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
padding: 0;
margin: 0;
/* Set the active Menu Bar with this class, currently setting
z-index to accomodate IE rendering bug:
http://therealcrisp.xs4all.nl/meuk/IE-zi...
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this
container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: center;
cursor: pointer;
width: 132px;
float: left;
/* Submenus should appear below their parent (top: 0) with a
higher z-index, but they are initially off the left side of the
screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8.2em;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation
MenuBarSubmenuVisible, we set left to auto so it comes onto the
screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 8.2em;
/* Submenus should appear slightly overlapping to the right
(95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation
MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text
decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #7D8BAE;
padding: 0.5em 0.75em;
color: #FFFFF5;
text-decoration: none;
border-right-width: 2.5px;
border-left-width: 2.5px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #536186;
border-right-color: #536186;
border-bottom-color: #536186;
border-left-color: #536186;
/* Menu items that have mouse over or focus have a blue
background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
background-color: #DFE2EC;
color: #7D8BAE;
/* Menu items that are open with submenus are set to
MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal
a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal
a.MenuBarSubmenuVisible
background-color: #DFE2EC;
color: #7D8BAE;
SUBMENU INDICATION: styles if there is a submenu under a
given menu item
/* Menu items that have a submenu have the class designation
MenuBarItemSubmenu and are set to use a background image positioned
on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that have a submenu have the class designation
MenuBarItemSubmenu and are set to use a background image positioned
on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-rep
Thanks
Mike

libertymike wrote:
> However, where the bar is located - the client wants the
submenus to display
> above the main menu bar.
>
> How do I accomplish this?
I answered the same question in the Dreamweaver online help
page
"Customize the Menu Bar widget".
http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSEE4C0148-A6F4-4bf5-9DEF-CE06AB026214a .html
Scroll down to the comments section, and look for my answer
to Alve
Henricson's question dated February 8, 2009.
David Powers
Adobe Community Expert, Dreamweaver
http://foundationphp.com

Spry Menu Bar - Freezing the Menu item in hover when clicking a submenu item

Hi,
I am trying to add a feature to a verticle spry menu bar that freezes the menu item or "parent" (to apear to be hovered) when clicking one of the parents sub-menu items. I want to do this so that users can know how they arrived at the page they're on.
Thanks for your help,
-Shiva

To look at your intention in a different way,
Hover over a submenu item
Parent item is colored/indicated
Submenu item is colored/indicated
Click on the submenu item
New page opens
Parent item "remains" colored/indicated on the new page
There are three or four ways to do this, depending on your site setup, but one basic concept to understand. The emphasis on the Parent menu item is totally independent of whether you got to the new page via the menu or by some other means. The emphasis will always be there, though it will appear to be connected to your clicking on the menu!
Say you have a menu with two Parent menu items, flowers and trees.
On the Flowers menu are submenus: Tulips, Roses, and Gardenias, On all three different Flowers pages (Tulips, Roses, Gardenias), the Flowers parent item will be emphasized.
On the Trees menu are submenus: Oak, Maple, Spruce. On all three different Trees pages (Oak, Maple, Spruce), the Trees parent item will be emphasized.
If you want to go in to each page individually, you can use a general indicator like id="localemphasis". (To emphasize more than one thing on a page, use a class instead of an id)
Using this method, on the Tulips, Roses, and Gardenias pages, put id="localemphasis" on the Flowers parent menu item.
On the Oak, Maple, and Spruce pages, put id="localemphasis" on the Trees parent menu item.
To control the emphasis from the CSS stylesheet, you won't need to go into each page, but you will ID each parent menu item.
Give each 'category' (Flowers, Trees) page a body ID to match the category
Every Flower page wants the Flower parent menu item emphasized, give all three Flower pages a body tag like this: <body id="flowers">
LIkewise, every Tree page wants the Tree parent menu item emphasized, as <body id="trees">
Within the menu itself and on ALL pages, give each parent menu item an id to correspond to its category
<li id="flowers_m">Flowers</li>
<li id="trees_m">Trees</li>
          I have added a "_m" to remind myself that it is the menu item's id. You might need to put the id on the <a> link if you have not used a list for your menu.
In your CSS stylesheet,
   #flowers #flowers_m,
     #trees #trees_m {background-color: red; color: white;}
Please use your own code! White on red might not be your cup of tea...use the same styling as the "hover" styling you mention in your query.
To interpret what we have just done, we have said
     make the background-color red and the text white
for the parent menu item Flowers (id="flowers_m") when you are on a Flowers page (body id="flowers")
and for the parent item Trees (id="trees_m") when you are on a Trees page (body id="trees").
This emphasis is good feedback for your user...remember that for SEO purposes, you will also want to use actual HTML text to reinforce the page environment, that is, h1 titles like FLOWERS and TREES. That will provide more feedback for your user.
Beth

Rounded Edges for submenu items

Similar Messages

Maybe you are looking for