2005年1月19日
Recent関連の一覧変更
メインのサイドバーにある「Recent Comment」「Recent Trackback」と、カテゴリー別、月別、個別アーカイブにある「Recent Entry」の表示ですが、改行があると先頭からになって、すごく嫌だったので、下記の方法に変更しました。当初はULとILタグを使ったリストで表示していましたが、無駄に空間ができてさらに見づらくなったので、さらに↓の方法に見直しました。
リストにしたい部分をCLASSで指定します。(ここでは、recent_comment_entryとします。)
recent_comment_entryをCSSにて下記にて定義します。
ポイントは、リストマークをbackground-imageで指定して(no-repeatも忘れずに指定)、このimageの大きさをpadding-leftでずらして文章が始まるように指定します。
.recent_comment_entry{
background: url("image/gtool/bluebtn.gif") no-repeat;
margin-top: 0px;
margin-bottom: 7px;
padding-left: 12px;
}
これで、改行はbackground-imageより後ろになるため、リストのように表示できます。
#これって、常套手段なのでしょうか?(^^;)
投稿者 yoshi | 2005年1月19日00:27 | カテゴリ PC