border
とoutline
、box-shadow
プロパティーを組み合わせ、それぞれ別に少しずらしてアニメーションさせようとかそういう変なの考えてたら、Firefox 21(及びAurora 23)とそれ以外でoutline
が描画される位置が違うことを知った。最近は普通に書くとFirefoxでハマることが多いのは僕だけか。
Demo: outline
and box-shadow
Firefox 21とAurora 23ではbox-shadow
の外側にoutline
が描画されてしまい、ぼかしが入ったりすると隙間ができる。
CSS3 BackgroundsとCSS3 UIを当たった限りでは、outline
はスペースを確保しないとなっていることとouline-offset
の項にデフォルトでは枠線のすぐ外側から描画されるべきくらいしかどう描画すべきかの指針は見つけられなかった。outline-offset
の項を尊重すればバグということになりそう。
Bugzillaでは「こうすればなんとかなるよ!」に「ここでハックの話しすんな」とか「これでもいいよね?」に「うるせーバグなんだから直せ」みたいなほほえましいやりとりだった。4年以上前からあるのか……。