Hatena::Groupyaruo-memo

jigendaddyの日記

 | 

2012-04-22お祝いということでもないけど

おめでとうございます

おめでとうございます - jigendaddyの日記 を含むブックマーク はてなブックマーク - おめでとうございます - jigendaddyの日記 おめでとうございます - jigendaddyの日記 のブックマークコメント

短くするにはと考えて、コメントが長い時は2列にしたと。

あと、一つのレスで突っ込みどころが2個所以上あった時も2列に

「オンリーブログ2年目だとさ」「支援絵頂きましたー」「では延長と、誤字脱字の訂正を」【2周年記念の雑談】 ? やらない夫オンリーブログ

やらない夫オンリーブログさんが2周年だそうです。それを記念してというわけでもないですが、私なりにレスを2列にする方法を考えてみました。

サンプル

http://jigendaddy.web.fc2.com/yaruo/nidan.html

CSS

.waku{
width:100%;
}
.rh_left{
width:50%;
background-color:ccccff;
float:left;
font-size:80%;
}
.rh_right{
width:50%;
background-color:99ffcc;
float:right;
font-size:80%;
}
.rb{
padding-left:30px;
font-weight:bolder;
font-family: "メイリオ", "MS Pゴシック", sans-serif;
font-size:110%;
}

分かりやすくする為に背景に色をつけました。文字が左寄せになるので、レス本文は左に余白を作りました。


メリット

メリット - jigendaddyの日記 を含むブックマーク はてなブックマーク - メリット - jigendaddyの日記 メリット - jigendaddyの日記 のブックマークコメント

  • dl-dtタグの構造を残せる

オンリーブログさんは基本divタグでレスを囲んでいらっしゃるようですが、これなら私のようにdl-dt-ddタグを基本とした構造の書き方でも、ddタグを消すだけで可能です。

デメリット

デメリット - jigendaddyの日記 を含むブックマーク はてなブックマーク - デメリット - jigendaddyの日記 デメリット - jigendaddyの日記 のブックマークコメント

  • 2700のごとく、左→右→左→右と交互に書く必要がある。

左→右の形を基本にしていますので、まず左のレスだけ並べて、それから右のレスを並べていくという書き方には不向きです。*1解決策としては、こちらを使うくらいしか手が無いです。

  • 作るファイルが多くなるので作業が面倒

クラスがrh_leftとrh_rightのファイルを2つ作って、そこから抜き出す必要があります。タブを2つ同時にスクロールするテキストエディタを使うと便利なのですが、私の探し方が悪いのかフリーソフトだと見当たりませんでした。ご存知の方は是非教えて下さい。

*1:オンリーブログさんはこのデメリットを見越して、tableタグを使われたのだと私は勝手に考えています。

 |