How do I make the background color of a link change once it is visited?

My CSS:

#header > a {
float: right;
vertical-align: middle;
display: table-cell;
margin: 5px;
color: #7e7e7e;
text-decoration: none;
font-family: Tahoma;
font-weight: 550;
}

#header > a:visited {
padding: 2px;
background-color: white;
}

#header > a:hover {
color: black;
padding: 2px;
box-shadow: 1px 1px 1px 1px black;
}

It looks and acts right when hovered over, but once clicked the background doesn’t change. What’s wrong?

(It says #header because that’s the div they’re nested in)

which exercise is this? If you want hover to work, hover should be before visited:

#header > a:hover {
  color: black;
  padding: 2px;
  box-shadow: 1px 1px 1px 1px black;
}
#header > a:visited {
  padding: 2px;
  background-color: white;
}