CSSのtext-decoration: none;が効かない

質問

こんにちは。
ＣＳＳでリストタグ内のリンクのアンダーラインを消すために、

.side_menu li {
line-height: 100%;
border-bottom: 1px solid #FFFFFF;
}
.side_menu a {
display: block;
padding-left: 30px;
background: #FFFFFF;
width: 160px;
text-indent: -17px;
text-decoration: none;
}
.side_menu a:hover {
background: #BDE2F7;
text-decoration: none;
}

としました。
作業しているうちに、きちんと消えていたリンクのアンダーラインが付いているのに気づきました。
すべてにではなく、数行なのです。付いてないところもあります。
htmlにゴミが入ってるのかと思い、再入力したのですがなぜか傷が広がります。
こんな現象って・・・？
text-decoration: none;を効かせるには、どう対処すればいいのでしょうか？
よろしくお願いします。

回答No.1

steel_gray

質問文に挙げられていない部分のCSSの記述が影響しているのかもしれません。
他のリンクに付けたつもりのtext-decoration:underline;が効いてしまっているとか。

念のために次のように書いておいてみてはどうでしょうか？
.side_menu a:link {text-decoration: none;}
.side_menu a:visited {text-decoration: none;}
.side_menu a:hover {background: #BDE2F7;text-decoration: none;}
.side_menu a:active {text-decoration: none;}
※ :link～ :activeまでの順序も大事です。

お礼

ありがとうございます。
そして、すみません・・・質問してすぐに解決しましたm(__)m
a:visitedを存在させればうまく行きました。
クリック後はvisited状態となるためそうなりますよね(^_^;)
いつもはa:link avisitedと同時に書いていたので基本的なことを忘れてました。（恥）
不思議なのは、当初はvisitedがなくてもきちんと動いていたことです。
ＣＳＳはときどき不思議なことが起こりますね・・・

とにかく、お手数おかけしました。
ありがとうございます。