JCWEBHOST
asked on
css for menu
Hey guys i have an menu and css friendly to convert to ul and li, my probelm is setting the select item colour in the menu.
here my code:
<div class="Menu" id="ctl00_Menu">
<div class="AspNet-Menu-Horizon tal">
<ul class="AspNet-Menu">
<li class="AspNet-Menu-Leaf AspNet-Menu-Selected">
<a href="Default.aspx" class="AspNet-Menu-Link AspNet-Menu-Selected">
Profile</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="javascript:__doPostB ack('ctl00 $Menu','bA bout Us')" class="AspNet-Menu-Link">
About Us</a>
</li>
<li class="AspNet-Menu-WithChi ldren">
<a href="javascript:__doPostB ack('ctl00 $Menu','bS ervices')" class="AspNet-Menu-Link">
Services</a>
<ul>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Deceased Estates</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Civil & Criminal Litigation</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Family Law</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Law of Persons</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Criminal Law</a>
</li>
</ul>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
Support Staff</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="Contacts.aspx" class="AspNet-Menu-Link">
Contacts</a>
</li>
</ul>
</div>
here my css
/* MENU -------------------------- ---------- ---------- ---------- */
.Menu
{
}
.Menu ul li
{
background-position: right;
font-family: 'Century Gothic';
font-size: 14px;
height: 38px;
font-weight: normal;
line-height: 38px;
padding-left: 20px;
padding-right: 40px;
background-image: url( '../images/dots.jpg' );
background-repeat: no-repeat;
}
.Menu ul li a
{
color: #FFFFFF;
}
.Menu ul li a:hover
{
color: #fec054;
}
.Menu ul li AspNet-Menu-Leaf AspNet-Menu-Selected
{
color: #fec054;
}
.Menu ul li ul
{
margin-top: -3px;
}
.Menu ul li ul li
{
padding: 0;
z-index: 2;
background-color: #49191c;
background-image: url( '../images/red_bg.jpg' );
background-repeat: repeat;
line-height: 25px;
width: 170px;
}
.Menu ul li ul li a
{
font-family: Arial;
font-size: 12px;
color: #FFFFFF;
font-style: italic;
padding-right: 10px;
padding-left: 10px;
}
.Menu ul li ul li a:hover
{
background-color: #582427;
color: #FFFFFF;
}
here c# code to set the select couse the menu is in the materpage
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Menu menu = (Menu)(this.Master.FindCon trol("Menu "));
menu.FindItem("Profile").S elected = true;
}
}
here my code:
<div class="Menu" id="ctl00_Menu">
<div class="AspNet-Menu-Horizon
<ul class="AspNet-Menu">
<li class="AspNet-Menu-Leaf AspNet-Menu-Selected">
<a href="Default.aspx" class="AspNet-Menu-Link AspNet-Menu-Selected">
Profile</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="javascript:__doPostB
About Us</a>
</li>
<li class="AspNet-Menu-WithChi
<a href="javascript:__doPostB
Services</a>
<ul>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Deceased Estates</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Civil & Criminal Litigation</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Family Law</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Law of Persons</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
• Criminal Law</a>
</li>
</ul>
</li>
<li class="AspNet-Menu-Leaf">
<a href="#" class="AspNet-Menu-Link">
Support Staff</a>
</li>
<li class="AspNet-Menu-Leaf">
<a href="Contacts.aspx" class="AspNet-Menu-Link">
Contacts</a>
</li>
</ul>
</div>
here my css
/* MENU --------------------------
.Menu
{
}
.Menu ul li
{
background-position: right;
font-family: 'Century Gothic';
font-size: 14px;
height: 38px;
font-weight: normal;
line-height: 38px;
padding-left: 20px;
padding-right: 40px;
background-image: url( '../images/dots.jpg' );
background-repeat: no-repeat;
}
.Menu ul li a
{
color: #FFFFFF;
}
.Menu ul li a:hover
{
color: #fec054;
}
.Menu ul li AspNet-Menu-Leaf AspNet-Menu-Selected
{
color: #fec054;
}
.Menu ul li ul
{
margin-top: -3px;
}
.Menu ul li ul li
{
padding: 0;
z-index: 2;
background-color: #49191c;
background-image: url( '../images/red_bg.jpg' );
background-repeat: repeat;
line-height: 25px;
width: 170px;
}
.Menu ul li ul li a
{
font-family: Arial;
font-size: 12px;
color: #FFFFFF;
font-style: italic;
padding-right: 10px;
padding-left: 10px;
}
.Menu ul li ul li a:hover
{
background-color: #582427;
color: #FFFFFF;
}
here c# code to set the select couse the menu is in the materpage
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Menu menu = (Menu)(this.Master.FindCon
menu.FindItem("Profile").S
}
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
thanks
Is that not the color you wanted to change?