Solved

Menu Control CSS background within background help!

Posted on 2007-11-22
6
1,069 Views
Last Modified: 2010-05-18
I have created a menu using the built-in menu control. I setup a skin and a style sheet.

On my sub menu, my menu background displays fine, but the text itself also has a mini version of the background. So I have a background within a background with the text inside the inner background.

Help me get rid of the background behind the text. I only want the actual sub menu background.

 <asp:Menu ID="menu1" SkinID="menuskin1" runat="server" DataSourceID="SiteMapDataSource1">
                                    </asp:Menu>

<asp:Menu runat="server" SkinID="menuskin1" DynamicEnableDefaultPopOutImage="false"
    StaticEnableDefaultPopOutImage="false" Orientation="Horizontal"
    MaximumDynamicDisplayLevels="2" StaticDisplayLevels="2">
    <StaticMenuItemStyle CssClass="menua" HorizontalPadding="8px"
        ItemSpacing="0px" Height="30px" />
    <DynamicMenuItemStyle CssClass="menub" HorizontalPadding="8px"
        Height="30px" />
    <DynamicMenuStyle HorizontalPadding="0px" />
    <StaticHoverStyle Height="30px" />
    <DynamicHoverStyle Height="30px" />
</asp:Menu>

.menub
{
    font-size: 13px;
    background-image: url(menubg.gif);
    color: #FFFFFF;
    font-family: Verdana;
    text-decoration: none;
    font-weight: Bold;
    text-align: left;
    border: 0;
    padding: 1;
}


.menub a:visited, .nav a:visited
{
    color: #FFFFFF;
    text-decoration: none;
}

.menub a:hover
{
    color: #c7cfeb;
    text-decoration: none;
}
0
Comment
Question by:Starr Duskk
  • 4
  • 2
6 Comments
 
LVL 30

Accepted Solution

by:
VirusMinus earned 500 total points
ID: 20337025
try this
.menub a:visited, .nav a:visited

{

    color: #FFFFFF;

    text-decoration: none;

    background:none !important;

}
 

.menub a:hover

{

    color: #c7cfeb;

    text-decoration: none;

    background:none !important;

}

Open in new window

0
 
LVL 1

Author Comment

by:Starr Duskk
ID: 20337297
That works for the visited and hovers, but what about the unvisited? how do i get it to go away for that?
thanks!
0
 
LVL 1

Author Comment

by:Starr Duskk
ID: 20337360
figured it out. needed to add a:link

thanks!
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 1

Author Comment

by:Starr Duskk
ID: 20337398
I added a:link like so:

.menub a:link, a:visited
{
    color: #FFFFFF;
    text-decoration: none;
   background:none !important;    
}

And it caused all my other hyperlink background images to disappear. I even added important there....

.Logo
{
    display: block;
    width: 227px;
    height: 75px;
    background: url(logo.gif) !important;
}

It is called like this:
<a href="<%= ResolveClientUrl("default.aspx")%>" class="Logo"></a>

How do I fix that please?
0
 
LVL 30

Expert Comment

by:VirusMinus
ID: 20337937
ok... what you need to do is to give the links that don't need backgrounds a class. like this:

<a class="nobg" href="#">link</a>

then alter the styles above as follows:

.menub a.nobg:visited, .nav a.nobg:visited
{
    color: #FFFFFF;
    text-decoration: none;
    background:none !important;
}
 
.menub a.nobg:hover
{
    color: #c7cfeb;
    text-decoration: none;
    background:none !important;
}
0
 
LVL 1

Author Comment

by:Starr Duskk
ID: 20340137
thanks so much! that worked!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Need a complete list of ASP.NET page load events 3 26
Syntax error 9 45
Interview questions for support of a legacy ASP.NET site 4 38
SQL Exceptions 3 37
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

27 Experts available now in Live!

Get 1:1 Help Now