新レイアウト用コメント周り(暫定版)

div.comment,
div.refererlist{
  text-align: left;
  padding: 0;
  margin: 0 0 15px 0;
  zoom: 1;
}

div.caption{
  text-align: right;
}

div.caption a{
  text-decoration: none;
  border-bottom: solid 1px #eee;
}

.refererlist ul{
  border-top: solid 1px #ddd;
  margin: 0;
  padding: 7px 0 0 15px;
  list-style-type: circle;
  text-align: left;
  font-size: 90%;
}

.commentshort{
  border-top: solid 1px #ddd;
  margin: 0;
  padding: 0;
  zoom: 1;
}

.commentshort a{
  text-decoration: none;
}

.commentshort p{
  margin: 1.5em 0;
  padding: 0;
  font-size: 100%;
  zoom: 1;
  position: relative;
}

span.canchor{}
span.canchor a{}

span.commentator{
  font-weight: bold;
}

span.commentator,
span.commentator a {
  text-decoration: none;
}

.commentshort p img.hatena-id-icon {
  margin-left: 0;
}

.commentshort span.timestamp {
  font-size: 90%;
  position: absolute;
  right: 0;
  top: 0;
}

.commentshort span.timestamp a {
  color: #aaa;
  margin: 0;
  text-decoration: none;
  font-weight: normal;
}

.commentshort span.commentbody {
  display: block;
  padding: 0.5em 0 0 20px;
}

drizzle


アンテナ用に使っているやつのダイアリー版。ボーダーの色を冬っぽいのに変えたけど。これの特徴ははてな標準のグレーのヘッダにタイトル部の色を合わせて作っているという所です。なのでこんな変な配色に。アンテナはまだヘッダ画像が昔のままなのでこうしないといけないわけ。このシリーズは割と人気があるようなのでカラーバリエーションを作ってそが部に公開してみようかなと計画中。「nimbus」に合わせてこのシリーズは天候に関係ある英単語をつけることにしてるのだけどそろそろ限界。

muffler


冬をさきどりました。
これはCSSの指定的にだいぶ無理をしてるので個人的にはすごく気に入っていますが、CSSに詳しくないとbackgroundの画像の%指定とposition:absoluteの%配置を合わせる時の問題とか知らないと思うので、苦労具合が伝わらないので残念です。
あとこのレイアウトは3年くらい前に簡単デザインで作った「270」の時からアイデアはあったのですが、その当時は構造的にうまい組み合わせが思いつかなかったのであのような形になりました。やっぱ3年もCSSいじってるとうまいこといくようになるんですねー。継続は力ですね。