バックナンバーをコンパクトに表示: べつになんでもないこと

[画像]
バックナンバーが13行も表示されると、なんだか間延びして見えます。
これまではスクロールバーを付けて表示してました（画像上）。
CSSはこんな感じ。

.mod-backno ul {
        width: 8em;
        padding-top: 5px;
        overflow: auto;
        height: 6em;
}

いまいち勝手がよくなかったので、今回は並べて表示してみました。
（というか、昨日の2列表示で満足できなかったので更にいじってみたｗ）

右サイドバーの場合、184px→190pxに拡張してから（しないと多分2列になるかと）

#right {width: 190px;}
.mod {width:190px;}

.mod-backno ul{text-align:center;}
.mod-backno li.mod-text{
        display:inline;
        padding:0 2px;
        line-height:1.7em;
}
.mod-backno ul li a{
        text-decoration:underline;
        font-family:monospace;
        white-space:nowrap;
}

IE 6対応のため修正しました。
たいていはCSS編集の末尾に追加するだけで大丈夫かと。
※#rightと.modのwidthが元々190px以上のデザインの場合、最初の2行は消して下さい。

並べるために<li>がlist-itemなのを「display:inline;」に変更。表示をそろえるために「font-family:monospace;」、年月の途中で改行させないために「white-space:nowrap;」としています。

あと数字だらけで一見ごちゃごちゃして見えたので、リンクに下線（text-decoration:underline;）を表示してまとまりを強調してみました。

さて、ちゃんとペンギンに戻せるのかｗ