CODEWITHSUNDEEP
csshyperlinkvisited
budamivardi
budamivardi

Reputation: 760

How to Set Background for Visited Links

Hi I try to set a background for visited links, but it does not work. What is going wrong?

CSS

ul a {display:inline-block; background:red url("https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSM7ZUDsq2jyP6Vz2yEmPl1HPVYQ5lUSL5MUoPvZw786K9mDfrWx9ZwYrY") center center no-repeat;
  ;color:#333;height:40px;line-height:40px;font-size:18px}
ul a:visited { background:blue url("https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcRY3mOWqadrnwEId1cCx6fVM_ffhE1OzmnbGcRrkKPv1YGxHUZElGyGuc8") center center no-repeat;
;color:#fff}

HTML

<ul>
    <li><a href="http://www.google.com">google</a></li>
    <li><a href="http://www.yahoo.com">yahoo</a></li>
    <li class="t2" ><a href="http://www.adsense.com">adsense</a></li>
    <li><a href="http://www.budamivardi.com">budamivardi</a></li>
    <li><a href="http://www.jsfiddle.com">jsfiddle</a></li>
    <li><a href="http://www.jsfiddle.com.tr">jsfiddle</a></li>
    <li><a href="http://www.jsfiddle.de">jsfiddle</a></li>
</ul>

jsFiddle

Upvotes: 0

Views: 457

Answers (1)

TimSPQR
TimSPQR

Reputation: 2984

You had two extra colons and were missing a colon (your CSS was very compressed).

FIDDLE

I removed the background images so only the color changes.

You can now "adjust" it as you see fit.

The CSS spec does not allow background-images on :visited links.

CSS:

ul a {
    display:inline-block; 
    background-color: red;
    color:yellow;
    height:40px;
    line-height:40px;
    font-size: 18px;
    padding: 10px;
}
ul a:visited {
    background-color: blue;
    color: green;
}

Upvotes: 1

Related Questions