revisited mouse over the log on link

Question

I leave this in the default css file for the site

.hover  a
{
    background-color:Gray;
    text-decoration:none;
}

.hover  a:hover
{
    background-color:Red;
    color:White;
}

and in _LogonPartial.cshtml

@if(Request.IsAuthenticated) {
    <text>Welcome <strong>@User.Identity.Name</strong>!
    [ @Html.ActionLink("Log Off", "LogOff", "Account") ]</text>
}
else {
    @Html.ActionLink("Log On", "LogOn", "Account", new { @class="hover"}) 
}

Only the class hover->a is effective, it is also strange to me as to why the URL when my mouse is over the Log On link adds "?length=7", what is that ?

Not sure if it's intended or not (and it doesn't solve your problem in any way), but your only applying the hover class to the "Logon"link and not the "Log Off" link. — Joshua Enfield, Feb 17 '12 at 17:42

score 0 · Answer 1 · edited May 23 '17 at 12:27

To be complete.

The CSS

Replace .hover a:hover with a.hover:hover

The ?Length issue

This link explains why it happens: Why does Html.ActionLink render “?Length=4”

According to the linked post changing the ActionLink to the following should fix that.

Html.ActionLink("Log On", "LogOn", new { controller = "Account" }, new { @class = "hover" })

or if you are coming from the Account controller already, then you don't need to specify it again in the link and null will also work. null causes the link to go to the action in a controller the view came from to begin with.

Html.ActionLink("Log On", "LogOn", null, new { @class = "hover" })

Bascially you were using the wrong override of ActionLink.

score 0 · Answer 2 · answered Feb 17 '12 at 18:01

0

Your css should be:

a.hover
{
    background-color:Gray;
    text-decoration:none;
}

a.hover:hover
{
    background-color:Red;
    color:White;
}

answered Feb 17 '12 at 18:01

Zach Green

3,421
4
29
32

revisited mouse over the log on link

2 Answers2