小細工です。

たとえば、下記のような ul / li の項目があったとしましょうか。

<ul class="category">
 <li><a href="/wp/category/column/">コラム</a></li>
 <li><a href="/wp/category/it/">IT</a></li>
 <li><a href="/wp/category/it/programing/">プログラミング</a></li>
　：
</ul>

CSSを組んで、下記のようなイメージとなりましたと。
※今回はcssはあまり関係ないので、割愛します。

さてさて、aがブロック要素かなにかでwidth:100%になっていれば、「コラムの端っこ」をクリックしても、コラムのページへ飛びますよね。

jQueryによる解決

オーソドックスな解決法です。
jQueryで、こんなソースを書きます。

$(function() {
 $('ul.category li').click( function() {
    window.location.href = $(this).children('a').attr('href');
 });

また、hoverを使えば、マウスオーバー時に背景を変えることもできますよ。

 $('ul.category li').hover (
    function() {
        $(this).css("background-color","#fafafa");
    },
    function() {
        $(this).css("background-color","transparent");
    }
 );

ものすごく安直な対応ですけども、