Question

I came across this free example website design template which has some links across the top. On hover, the link text and their background are supposed to change colour, according to the CSS. It works in Firefox, Opera and IE but there is no change on hover in Chrome 17.0.963.79 and Safari 5.1.2, so I’m suspecting a webkit issue. But the CSS looks innocuous enough. Where’s the problem here? The part of the CSS for this hover is the following:

.topNaviagationLink a:hover
{
text-align:center;
border-bottom:none;
color:#0C61C9;
display: block;
width:121px;
height: 35px;
line-height: 35px;
background-image:url(tab.png);    
}

Answer 1

That’s interesting…

This works, would it be acceptable?

.topNaviagationLink:hover a
{
text-align:center;
border-bottom:none;
color:#0C61C9;
display: block;
width:121px;
height: 35px;
line-height: 35px;
background-image:url(tab.png); 
}