I've been using the Menu control to create a horizontal menu.  It looks great but I was to format the dynamic menus just slightly-- with a 1 px border on the left and top and a 2 px border on the right and bottom (for a 3-d effect).

I've created a CSS class to accomplish this:

.dyMenu1

{

border-top:#cdcdcd 1 solid;

border-left:#cdcdcd 1 solid;

border-bottom:#000000 2 solid;

border-right:#000000 2 solid;

}

and then assigned the property inside a Theme:

<DynamicMenuStyle CssClass="dyMenu1" />

Which results in the following HTML code being generated:

</table><div id="ctl00_Menu1n1Items" class="aspnet_s0 dyMenu1 aspnet_s8">

All of this seems correct but the borders on the DIV just do not display. 

Has anyone worked with borders this way that might be able to point me in the right direction?

Thanks!

Michael

Does setting the properties directly on the DynamicMenuStyle element work, as opposed to using a class? I definitely have this working (in beta 2 anyway, there were CSS problems with the beta 1 menu).

Dave

Yes, I can set the Border, BorderStyle, etc. properties directly (and that works) but I need to have two sides one color and the other two sides another color.

In plain old HTML I would just do:

style="border-left:#cdcdcd 1 solid;border-top:#cdcdcd 1 solid;border-right:#999999 2 solid;border-bottom:#999999 2 solid;"

Is there a way to add a style string like this to the DynamicMenuStyle?

In the resulting HTML I see that there are multiple classes listed:

class="aspnet_s0 dyMenu1 aspnet_s8"

I've never used multiple classes before in this manner (although I see that this is supposed to work according to various articles I've found on the web).  "aspnet_s8", I noticed, is completely blank in the STYLE declaration.

I keep shying away from ASP.NET for just this reason-- I can easily do this in HTML and/or ASP but have a hard time finding the right properties, etc. in ASP.NET.

Thanks for your help!

Here's my Menu declaration for one that works:

<asp:menu id="MyMenu" runat="server" datasourceid="siteData"
 orientation="Vertical"
 staticdisplaylevels="2" StaticSubMenuIndent="0"
 disappearafter="200"

 >
 <DynamicMenuStyle CssClass="dynamicMenu" />
 <DynamicMenuItemStyle CssClass="dynamicMenuItem" />
</asp:menu>

And the styles are:

.dynamicMenu {
    background-color:#a83930;
    border-color: #fdea12;
    border-style: solid;
    border-width: 1px;
}
.dynamicMenuItem
{
    background-color: #a83930;
    border-color: #fdea12;
    border-style: solid;
    border-width: 1px;
}

There's a ton of other styling for the rest of the page and layout, but the menu works fine. I'm currently repaving my laptop so can't boot into the beta 2 partition at the moment otherwise I'd test out your code.

Dave

Very bizzare.

When I replace my styles code with yours, your border displays just fine.

It seems that something is preventing the "border-left, border-right, etc." items from being displayed.  (I created a standalone HTML page with the "border-left, border-right, etc." and it works just fine.

I took a look at the generated JavaScript but could not locate anything that is suspicious.  I'm thinking that there must be something in there that is removing the className from the code when it changes the display to visible.

Thanks for your help.  Let me know if you think of anything else that might be the culprit.

Michael

I figured it out.

I was leaving off the "px" on the width designation.  Once I added it, it works great.

(I don't normally add the "px" and it had always worked fine.... interesting.)

Thanks again for your help!