MENU code:
<div class="clear hideSkiplink">
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal" >
<LevelMenuItemStyles>
<asp:MenuItemStyle CssClass="menu" />
<asp:MenuItemStyle CssClass="menu2" />
</LevelMenuItemStyles>
<Items>
<asp:MenuItem NavigateUrl="Default.aspx" Text="Home"/>
<asp:MenuItem Text="Land Analysis Database" Selectable="false">
<asp:MenuItem NavigateUrl="LA_Submit.aspx" Text = "Land Analysis Input Form"/>
<asp:MenuItem NavigateUrl="LA_Results.aspx" Text="Land Analysis Results"/>
</asp:MenuItem>
<asp:MenuItem Text="Qualtiy Control Database">
<asp:MenuItem NavigateUrl="QC_Submit.aspx" Text="QC Submit Input" />
<asp:MenuItem NavigateUrl="QC_Results.aspx" Text="QC Results" />
<asp:MenuItem NavigateUrl="QC_Monthly.aspx" Text="Monthly Report" />
</asp:MenuItem>
</Items>
</asp:Menu>
</div>
CSS:
div.hideSkiplink
{
background-color:#3a4f63;
width:100%;
}
.menu
{
list-style:none;
margin:0;
padding:0;
width:auto;
padding-left: 8px;
}
.menu a, .menu a:visited
{
background-color: #465c71;
border: 1px #4e667d solid;
color: #dde4ec;
line-height: 2.8em;
padding: 4px 20px;
text-decoration: none;
}
.menu a:hover
{
background-color: #bfcbd6;
color: #465c71;
text-decoration: none;
}
.menu a:active
{
background-color: #465c71;
color: #cfdbe6;
text-decoration: none;
}
.menu2
{
list-style:none;
margin-left:0px;
width:200px;
padding-left: 0px;
padding-right: 0px;
background-color: #f1f2f4;
border: 1px;
border-color:Gray;
border-left-style:dotted;
border-right-style:dotted;
border-bottom-style:dotted;
}
.menu2 a, .menu2 a:visited
{
background-color: #465c71;
margin-left:12px;
color: #dde4ec;
width: auto;
line-height: 2.0em;
padding: 2px 15px;
text-decoration: none;
}
.menu2 a:hover
{
background-color: #bfcbd6;
color: #465c71;
text-decoration: none;
}
.menu2 a:active
{
background-color: #465c71;
color: #cfdbe6;
text-decoration: none;
}
|