所詮CSSだし、モジュールって言うほどのモンでもないけど、折角なので公開。

• Information
• Archives
• Links
• Diary

CSS

.tab {
	text-align:left;
	margin:0 0 10px 0;
	padding:0 5px 26px 5px;
	_padding-bottom:25px;
	border:1px solid #aaa;
	background:#ccc;
}

.tab li {
	display:inline;
}

.tab li a {
	display:block;
	padding:5px 10px;
	margin-right:4px;
	border:1px solid #aaa;
	border-width:0 1px;
	background:#eee;
	float:left;
	width:100px;
	text-decoration:none;
	text-align:center;
}

.tab li.active_tab a {
	background:#fefefe;
}

.tab li a:hover {
	text-decoration:none;
	background:#f8f8f8;
}

.tab li.active_tab a:hover {
	text-decoration:none;
	background:#fefefe;
}

HTML

<ul class="tab">
<li><a href="/attention.html">Information</a></li>
<li><a href="/archives/">Archives.html</a></li>
<li><a href="/links">Links</a></li>
</ul>

説明するまでもないと思いますけど一応。
ULタグの下にあるLIタグの中にあるAタグをブロック要素にしています。
ワカンネって場合は、とりあえずCSSとHTMLのコードまるまるコピーするとそのまま使えますよ。
ハミ出るって場合は、他のCSSが干渉してるかもしれないので、.tab li a の paddingの値なんかを変更してみてください。