サイドバーのリンクをボタンっぽくしたいです。 (thread) | Questions List | ココログサポート Top

サイドバーに自分のページのリンクボタンを置きたいです。
画像は使わずに下記のブログで使用されているようなボタン（"あ行"とか"か行"とかの）リンクボタンにするには、どのようにすればいいのでしょうか？
（50音分けしリンクさせるページは作りました。）

http://videonavi.blog66.fc2.com/

マイリストでリンク部分の項目を作り、備考欄に下記のソースを記述しましたがボタン表示にならず、ただリンク文字が並んでいる状態にしかなりませんでした。
何が足りないのかご教授頂きたいです。よろしくお願いいたします。

<table border="0" width="97%" cellspacing="3" cellpadding="0" summary="項目のタイトル">
<tr>
<td width="33%" class="ichiran">
<a href="http://あ行のリンクページURL" class="button" style="width:40px">ア行</a>
</td>

<td width="33%" class="ichiran">
<a href="http://か行のリンクページURL" class="button" style="width:40px">カ行</a>
</td>
<td width="33%" class="ichiran">
<a href="http://さ行のリンクページURL" class="button" style="width:40px">サ行</a>
</td>
</tr>
<tr>
<td width="33%" class="ichiran">
<a href="http://た行のリンクページURL" class="button" style="width:40px">タ行</a>
</td>
<td width="33%" class="ichiran">
<a href="http://な行のリンクページURL" class="button" style="width:40px">ナ行</a>
</td>
<td width="33%" class="ichiran">
<a href="http://は行のリンクページURL" class="button" style="width:40px">ハ行</a>
</td>
</tr>
<tr>
<td width="33%" class="ichiran">
<a href="http://ま行のリンクページURL" class="button" style="width:40px">マ行</a>
</td>
<td width="33%" class="ichiran">
<a href="http://や行のリンクページURL" class="button" style="width:40px">ヤ行</a>
</td>
<td width="33%" class="ichiran">
<a href="http://ら行のリンクページURL" class="button" style="width:40px">ラ行</a>
</td>
</tr>
<tr>
<td width="33%" class="ichiran">
<a href="http://わ行のリンクページURL" class="button" style="width:40px">ワ行</a>
</td>
</tr>
</table>