CSS Color Attribute

Question

I am having an issue with the Color attribute for which I'm trying to apply to the Menu li anchor tag.

The li a:visited {color:red;} and li a.selected {color:green;} are applied correctly however the li a{color:blue;} is not being applied.

http://www.virtualpetstore.com

This class defines the blue which is not being applied:

.solidblockmenu li a {
    float: left;
    color: blue;
    font-family:Arial Black;
    font-size:12px;
    padding: 8px 20px 8px  20px;
    text-decoration: none;
    border-right: 1px solid white;
}

Here is the Menu markup:

<div id="menu2">
    <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
        <AnonymousTemplate>
            <ul id="solidmenu" class="solidblockmenu">
                <li><a href="~/default.aspx" runat="server">Incinio</a></li>
                <li><a href="~/empresa.aspx" runat="server">Empresa</a></li>
                <li><a href="~/webgrupodotnet.aspx" runat="server">Deserollo</a></li>
                <li><a href="~/webgrupodiseno.aspx" runat="server">Diseno</a></li>
                <li><a href="~/webgrupomovil.aspx" runat="server">Moviles</a></li>
                <li><a href="~/asociados.aspx" runat="server">Asociados</a></li>
                <li><a href="~/contacto.aspx" runat="server">Contacto</a></li>
                <li><a href="~/Account/Registrar.aspx" id="Registrar" runat="server">Registrar</a></li>
                <li><a href="~/Account/Login.aspx" id="HeadLogin" runat="server">Log-In</a></li>
            </ul>
        </AnonymousTemplate>
        <LoggedInTemplate>
            <ul id="solidmenu" class="solidblockmenu">
                <li><a href="~/default.aspx" runat="server">Incinio</a></li>
                <li><a href="~/empresa.aspx" runat="server">Empresa</a></li>
                <li><a href="~/webgrupodotnet.aspx" runat="server">Deserollo</a></li>
                <li><a href="~/webgrupodiseno.aspx" runat="server">Diseno</a></li>
                <li><a href="~/webgrupomovil.aspx" runat="server">Moviles</a></li>
                <li><a href="~/asociados.aspx" runat="server">Asociados</a></li>
                <li><a href="~/contacto.aspx" runat="server">Contacto</a></li>
                <li><span style="width: 25px;">
                    <asp:LoginStatus ID="headloginstatus" runat="server"  LogoutAction="redirect" LogoutText="log out" LogoutPageUrl="~/" />
                    </span>
                </li>
                <li><span>
                    <a href="/Account/ModificarCuenta.aspx" class="modifyuser">
                        <asp:LoginName ID="headloginname" runat="server" />
                    </a>
                </span>
                </li>
            </ul>
        </LoggedInTemplate>
    </asp:LoginView>
</div>

Here is the remaining ddmenu.css:

.solidblockmenu {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    float: left;
    font: bold 13px Arial;
    overflow: hidden;
    margin-bottom: 1em;
    border: 1px solid #625e00;
    border-width: 1px 0;
    background: black url("http://i.imgur.com/iTqzs.gif") center center repeat-x;
}
.solidblockmenu li {
    display: inline;
}
.solidblockmenu li a {
    float: left;
    color: blue;
    font-family:Arial Black;
    font-size:12px;
    padding: 8px 20px 8px  20px;
    text-decoration: none;
    border-right: 1px solid white;
}
.solidblockmenu li a:visited {
    color: Red;
}

.solidblockmenu li a:hover, .solidblockmenu li a.selected { 
    color: Green;
    background: transparent url("http://i.imgur.com/mjYcj.gif") center center repeat-x;
position: relative;
}

Have you tried using an RGB value instead? Like color:#00F — Andrew De Forest
– Andrew De Forest, Commented Mar 27, 2012 at 16:54
@Hardryv I tried navy, but I will try a hex value. Whats strange is that this functions here: jsfiddle.net/adtBM — Paul
– Paul, Commented Mar 27, 2012 at 16:58

iMoses · Accepted Answer · 2012-03-27 16:56:50Z

2

You've defined ul li a:link which overwrites the default rule (ul li a)

try:

ul li a:link {color: blue;}

or:

.solidblockmenu li a:link {color: blue;}

P.S. Based on the example link you provided, not the code you've posted.

The overwriting rule is #Soluciones_derecho2 ul li a:visited, ul li a:link

answered Mar 27, 2012 at 16:56

iMoses

4,3471 gold badge26 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

w3uiguru · Accepted Answer · 2012-03-27 16:59:55Z

0

Just try this below css in your ddmenu css

.solidblockmenu li a:link {
    float: left;
    color: blue;
    font-family:Arial Black;
    font-size:12px;
    padding: 8px 20px 8px  20px;
    text-decoration: none;
    border-right: 1px solid white;
}

answered Mar 27, 2012 at 16:59

w3uiguru

5,9152 gold badges24 silver badges25 bronze badges

Collectives™ on Stack Overflow

CSS Color Attribute

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related