Re: Where is the horizontal menu styles controlled at?

Hyacinth Broadchest — Sun, 03 May 2009 06:35:58 GMT

The top nav is a series of links in a div called nav-main.

So look in the style-sheet for this bit:

#nav-main a:link,
#nav-main a:visited {
	color:#FFFFFF;
	text-decoration:none;
}

#nav-main a:hover {
	color:#D4E7F8;
	text-decoration:underline;
}

#nav-main a:active {
	color:#FFFFFF;
}

As you can see, it is possible to have diferent colours for active, hover and visited links within that div.

They have done it this way so as not to override settings on other links outside of the nav-main div.

Re: Where is the horizontal menu styles controlled at?

yasserzaid — Thu, 26 Mar 2009 11:32:49 GMT

try this Example :

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="menu3.aspx.cs" Inherits="menu3" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
        .staticMenuItem
        {
            color:White;

            border:solid 1px black;
            padding:2px 4px;
        }
        .menuHover
        {
            color:#ffcc00;
            background-color:blue;
        }
        .dmenuHover
        {
            color:blue;
            background-color:#ff9900;
        }
        .dynamicMenuItem
        {
            color:black;
            background-color:#FF6600;
            padding:2px 4px;
        }
        .dynamicMenu
        {
            background-color: #ffcc00;
            border:Solid 1px black;
            filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true')" ;
        }
    </style>

     <style type="text/css">
        .staticMenuItem
        {
            color:White;

            border:solid 1px black;
            padding:2px 4px;
        }
        .menuHover
        {
            color:#ffcc00;
            background-color:red;
        }
        .dmenuHover
        {
            color:blue;
            background-color:#ff9900;
        }
        .dynamicMenuItem
        {
            color:black;
            /*background-color:#FF6600;*/
            padding:2px 4px;
        }
        .dynamicMenu
        {
            /*the background color for the dynamic menus both "popout" and non is covered by the
            DynamicMenuStyle-BackColor="#FF6600" in the <asp:Menu> tag*/
            /*background-color: #ffcc00;*/
            /*background-color: green;*/
            border:Solid 1px black;
            filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true')" ;
        }


    </style>

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:Menu
        id="Menu1" Visible="false"
        StaticMenuItemStyle-CssClass="staticMenuItem"
        StaticHoverStyle-CssClass="menuHover"
        DynamicHoverStyle-CssClass="menuHover"
        DynamicMenuItemStyle-CssClass="dynamicMenuItem"
        DynamicMenuStyle-CssClass="dynamicMenu"
        Runat="server" BackColor="Red" DynamicMenuStyle-BackColor="#FF6600" DataSourceID="SiteMapDataSource1">

        <StaticMenuItemStyle CssClass="staticMenuItem" />
        <DynamicHoverStyle CssClass="menuHover" />
        <DynamicMenuStyle CssClass="dynamicMenu" BackColor="#FF6600" />
        <DynamicMenuItemStyle CssClass="dynamicMenuItem" />
        <StaticHoverStyle CssClass="menuHover" />
    </asp:Menu>

    <br />
    <asp:Menu
        id="Menu2" DataSourceID="SiteMapDataSource1"
        StaticMenuItemStyle-CssClass="staticMenuItem"
        StaticHoverStyle-CssClass="menuHover"
        DynamicHoverStyle-CssClass="menuHover"
        DynamicMenuItemStyle-CssClass="dynamicMenuItem"
        DynamicMenuStyle-CssClass="dynamicMenu"
        Runat="server" BackColor="Red" DynamicMenuStyle-BackColor="#FF6600">

        <StaticMenuItemStyle CssClass="staticMenuItem" />
        <DynamicHoverStyle CssClass="menuHover" />
        <DynamicMenuStyle CssClass="dynamicMenu" BackColor="#FF6600" />
        <DynamicMenuItemStyle CssClass="dynamicMenuItem" />
        <StaticHoverStyle CssClass="menuHover" />
    </asp:Menu>
        <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" />
        <br />
        <br />

</div>
</form>
</body>
</html>

Good Luck

Where is the horizontal menu styles controlled at?

smejus57 — Wed, 25 Mar 2009 17:49:21 GMT

Where are the CSS styles for the horizontals navigation at the top (and bottom) controlled? I want to change the color of the text.

Small Business Starter Kit

Re: Where is the horizontal menu styles controlled at?

Re: Where is the horizontal menu styles controlled at?

Where is the horizontal menu styles controlled at?