さいきんこんなのばっかり作っている、というののサンプルを作ってみた。というか、今後もこんなのを作ることになりそうなので、自分が使いやすいようにサンプルを作った、というほうが正しい。
実物は、dt0208のサンプル、およびZIPファイルを参照のこと。例によって、自由に使ってかまわないことにする。formに必要な属性を書いてなくてvalidになっていないので、用途に応じてたしてほしい。
今回は、新しいテクニックはほとんど使っていない。基本的に、ADP: floatレイアウトでつまづかないためのTipsやCSSロールオーバーの話をそのまま使っただけだ。CSSのファイルをよく見れば、地雷を避けているのがわかるはず。
いちおう、細かく違う点を挙げる。まず、左寄せ、横幅固定のレイアウトなので、containerを使っていない。あと、h1やh2要素でimg要素を使っている。h2のほうは、背景画像にしたほうがいいかな、と思うが、h1は、印刷したときにロゴがあったほうがうれしい、というご意見(だれの?)に従った。SEO的にはよろしくないが、ここらへんも適宜用途に応じて変えてくだされ。
トラックバックURL: http://adp.daa.jp/cgi/mt2/mt-tb.cgi/496
なにげにMacIE5でこけてますね。なんでだろ。
MacのFirefoxとIEでみてみたんですけど、
同じに見えてますよー。
MacIEでも大丈夫になりました。忘れないようにメモ。overflow: hiddenがh1に書いてあったため、h1が消えてました。overflow: hiddenは元にしたCSSの残骸で、まったく必要ありませんでした。あと、floatしたほうにmargin-topを指定していたのが効いてなかったようです。floatはあいかわらず複雑怪奇ですなあ。
あ、ありがとうございます。すぐ判明したので、直してしまいました。