nth-childが効かない…。原因はなんでしょうか？

特定の要素にCSSを設定したく思い、nth-childを使って定義したのですが、一向に反映されません。
この記述のどこが間違っているのでしょうか？ご指摘お願いいたします。

■HTML
<div id="hogehoge">
<ul>
<li><a href="リンク">文章…………</a><br /></li>
<li><a href="リンク">文章…………</a><br /></li>
<li><a href="リンク">文章…………</a><br /></li>
<li><a href="リンク">文章…………</a><br /></li>
<li><a href="リンク">文章…………</a><br /></li>
…
…
</ul>
</div>

■CSS
#hogehoge li:nth-child(3n) {
margin:10px!important;
color:#fff!important;
}

指定したとおり、ID　hogehogeの中のリストの3の倍数に対してCSSで設定を行ってみるのですがビクともしないのです…。nth-childの使い方が間違っていますでしょうか？
リンク<a href>や<br />は訳あってこのように定義しています。

どなたかお分かりになる方いらっしゃいましたらアドバイス頂けますと幸いです。
よろしくお願い致します。
※確認はクロームとFFで現在行っています。

No.1 ベストアンサー 回答者： yambejp 回答日時： 2015/03/16 13:06

>CSSで設定を行ってみるのですがビクともしない

>※確認はクロームとFFで現在行っています。

chromeでもfirefoxでも想定通り表示されますが？
要素を最低限にしぼってテストしてみてください

この回答へのお礼

ご確認有難う御座います。
そうですよね、素のHTML上では出来るようです。
間にPHPの記述が多々あるので、出力の際に何か邪魔をしているかも知れません。もう一度詳しく確認してみたいと思います。お忙しいところご確認頂き有難う御座いました。

お礼日時：2015/03/16 14:15

No.2 回答者： ORUKA1951 回答日時： 2015/03/16 14:03

HTML修正

<div id="hogehoge">
　<ul>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a>/li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　</ul>
</div>
CSS修正
#hogehoge li{
margin:0;
}
#hogehoge li:nth-child(3n){
margin:10px;
}
#hogehoge li:nth-child(3n) a {
color:red;
}

※<br />や<br>は原則使うべきではない。スタイルシートで指定しましょう。
　⇒行区切りの強制: BR要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
　なお、未だにXHTML使ってるの???
※li要素の色を変えてもaには適用されないです。
※ひょっとして、
<div id="hogehoge">
　<ul>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a>
　　　<p><a href=""></a></p>
　　</li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　　<li><a href="リンク">文章…………</a></li>
　</ul>
</div>
のほうがよいのじゃないかと、HTMLは文書構造を正確にマークアップしましょう。