Munira
Munira

Reputation: 153

Why link:visited property doesn't work (for page link)?

I have linked between different pages. Now I want that if a visitor visits any page by clicking on the link, that link will changed into different colors.

In my case it's not working, I don't know why.

My code:

HTML:

    <div id="pageLink">
<ul>
<li><a href="index.php" id="index"><div id="indexDiv">Welcome</div></a></li>
<li><a href="about-me.php" id="aboutMe"><div id="aboutMeDiv">Bio</div></a></li>
</ul>
</div>

CSS:

    #index,#aboutMe{
text-decoration:none;

}
#index:visited,#aboutMe:visited{
color:red;
}
#indexDiv,#aboutMeDiv {
display:block;
text-decoration:none;
padding:5px;
color:green;
font-family:Tahoma;
font-size:20px;
}
#indexDiv:hover,#aboutMeDiv:hover{
color:gray;
}
#pageLink li{
        display:inline-block;
list-style:none;
}

Here is the Live

Upvotes: 0

Views: 98

Answers (1)

Manoj H L
Manoj H L

Reputation: 843

you are having a div inside a anchor tag with style color:green;

change the css snippet as

#index:visited > div,
#aboutMe:visited > div {
  color:red;
}

you will get red color when the anchor tag has :visited pseudo class.

Upvotes: 1

Related Questions