fixedとabsolute

TwitterのTLで流れてたツイートでこの2つの挙動が違うとかいうのを見て、そんなことあったっけ……あーでもrelativeの中だと違いそうとか思ったら本当に違っていました。両者はスクロールを無視するかしないかというような違いだけだと思ってました……。元発言がこのことを指していたかどうかは知りませんけど、エントリにしておきます。

View Demo: fixed and absolute

親のsection要素でrelativeを使っていると、absoluteが親の要素を基準としていますがfixedbody要素viewportが基準になってますね。

ということはfixedだと常に絶対配置されちゃうのかみたいな感じですけど、topleftなどの代わりにmarginを使ったりとかすれば、相対配置でかつ固定とかもちゃんと出来ると思います。top等が初期値のautoだと親とぴったり重なる位置に表示されるので。

この話は書いてませんが、25個のCSS 2.1のお話を12/01から1日に1つ表示するCSS 2.1 Advent Calendar '11というのを作りました。ものすごく適当な感じで書いたのであんまり真に受けないでください。「CSS3とか言う前にやるべきことあるよね?」という問題提起的な感じに捉えていただければ幸いです(慇懃無礼)。12/26以降は全て表示されるようになると思います。表示を制御するJavaScriptは1分くらいで書いたので怪しいですが……(12/01に表示されるかも怪しい)。view-source:禁止ということでひとつよろしくお願いします。