あー。友人の環境でレイアウト崩れてるっていうから「キャッシュじゃね？」って答えたときに思ったんだけど、

@import url(/stylesheets/a.css);

ってのがあったとして、a.cssはブラウザにキャッシュされるよなー。普通に考えて。 てことはa.css更新しても最新のが読み込まれないからデザインが壊れるのか。 これ、画像更新した場合もそうだなぁ……。

結局全部Railsでいうところの

<%= stylesheet_link_tag "a" %>

=> <link href="/stylesheets/a.css?1159464858" media="all" rel="Stylesheet" type="text/css" />

みたいにファイル更新の度にQUERY_STRING変えるように動的に書き出して読み込まないとダメかしらん。

と思ったけど普通はちまちまcss更新しないんですかね。 できあがってからあげるのか。

ブロック要素を包んでるinsに

ins { border: 1px solid black }

てな感じでスタイル設定しても、手元のfirefoxとoperaで正しくレンダリングされず。

どうやらMozilla 5.0系 CSSバグリストにある mozillaではdisplayプロパティで明示しない限りこれらの要素は常にインライン要素として扱われる というバグくさい。

他にはこの前こんなのがあった。次のようなボタンについて、

[OK]

幅が狭くて押しにくいと友人に言われたので

input[type="submit"] { min-width: 70px }

で解決かと思ったら、

[  OK  ]   <-- opera
[OK    ]   <-- firefox

となって萎えた。 width: 70pxとかした場合はOKがcenterに来るのに。firefoxにはがっかりですね。 とりあえずしかたがないのでwidthをセットしておくことに。 でもvalueが70px越えちゃったらどうせ見苦しく途中で切れるんだろ……？　

属性セレクタに対応してない小学生レベルのIE6が現役バリバリなので、 ボタンにclassをいちいち書いて回って最終的には

input.button { width: 70px }

なんていう激しくDRYに反するダサいことになった。

これ、結局押しやすい長さになるようにvalueを考えるしかないのかな？

[ログイン]
[新規作成]

みたいな。