タグ

ブックマーク / norisfactory.com (2)

  • スタイルシートをめぐる冒険: マージンを使ってdtとddを横並びにするとdtが消える

    定義リストで、dtとddを横並びにしたいとき、ddのマージンの調整でそれを実現するやり方は私がよく使うテクニックなのだが、あるとき、IE7で見たらdtがすっかり消えていて、あわてたことがある。原因は、またしても、その定義リストを含むボックスへの背景画像の指定だった。 [該当するブラウザ] Windows/IE7.0以下 症状 たとえば、年表のようなリストを角マルの矩形で囲むレイアウトを組んだとする(右図)。 角マル矩形は、 frame_top.gif(トップの部分)、 frame_bg.gif(中間部分)、 frame_btm.gif(ボトムの部分)、 以上3つの画像を、dlおよびdlを含むボックスに背景として指定することで実現している。詳細は以下の通りである(→サンプルページ1)。 【スタイルシート】 body { margin: 10px; padding: 0; } .box { w

    vv_boow_vv
    vv_boow_vv 2008/09/29
    対処法は、やはり、マージンの調整による横並びレイアウトは使わないこと、これに尽きる。
  • clearfixの決定版を作る -IE編-

    今回は、floatバグ対策における鬼門ともいえるIEのclearfixに挑戦する。しかし、その前に、何をもって「決定版」とするか、あらためておさえておこう。来なら、ひとつでも多くの種類、バージョンのブラウザでfloatをクリアできる(もしくは同じ効果を得られる)ことをもって、決定版とすべきなのだろうが、ここでは少し違う方針をとりたいと思う。簡単にいえば、CSS自体の正しさとか美しさを優先したいということだ。逆に、そのためには古いバージョンのブラウザなどは犠牲になってもしょうがない、と考えている。ここでいう「決定版」を定義してみよう。 1. 文法的に正しいこと このこととイコールとするには異論があるかもしれないが、「W3Cのvalidatorを通ること」と言い換えることもできる。少なくとも、通らないより通るほうがいい。 2. 内容的に理にかなっていること、意味不明でないこと いわゆるCSS

    vv_boow_vv
    vv_boow_vv 2007/09/05
    簡単にいえば、CSS自体の正しさとか美しさを優先したいということだ。逆に、そのためには古いバージョンのブラウザなどは犠牲になってもしょうがない、と考えている。ここでいう「決定版」を定義してみよう。
  • 1