タグ

CSSとIE6に関するkiyokichiのブックマーク (5)

  • float解除の決定版。clearfixを考えたら、進化した。

    現在この中でclearfixでよく使用されているプロパティは display:inline-block; height:1%(min-height:1%) zoom:1; でも良く考えたら、全て微妙です。 zoom:1はIEの独自仕様ですし、heightを使用する場合は、IE6,7に対応させるために2つのプロパティが必要です。 display:inline-blockもボックスの要素を変形させることになります。 hasLayoutのスイッチを見た時に、一番理に適ったプロパティはwidthかなと思いました。 子要素を囲む要素として、divやulなどデフォルトCSSがdisplay:blockのプロパティのものが多く、display:blockのプロパティの場合、width:100%で問題ないと思ったからです。 現在のブラウザ状況に適したclearfix 上記を踏まえ見直したclearfixが

    float解除の決定版。clearfixを考えたら、進化した。
    kiyokichi
    kiyokichi 2011/04/10
    いっつもheight:0;入れて対処してたけど、それだとダメなのかなー?
  • ol li の番号リストがIEで表示されないCSSバグ

    ol liとcssを指定したのに なぜかIEだけで番号リストが表示されない。。。 以前もliで悩まされた記憶があるんだけど~。 ググってみると苦しまれた方が多いようで 解決策として * { zoom: 1; } と指定して、かつ ul, ol, li { zoom: normal; } としてあげると即解決!!となるそうです。 zoom: 1;なんての、初めて知った。 でもあたしの直らないんですがっ_| ̄|○ 誰かタスケテ~~!! 必死に答えを探しては試す、を繰り返す。。。 そして見事に解決! それは、li要素にwidthを指定しないこと。 liをくくってるdivにwidth指定していたので それを消すと、解決した =3=3=3=3 でも、なんでダメなんだ~?? も~っ 人騒がせなIEめっ

    ol li の番号リストがIEで表示されないCSSバグ
    kiyokichi
    kiyokichi 2010/04/09
     *{zoom:1;}だとIE6でlist-style-typeが効かなかったり、インデントリストがバグったりする・・・ul, ol, li{zoom:normal;}足したらOKになったけど、意味がよくわからん…
  • IE6、IE7、IE8におけるCSSの違いまとめ | エンタープライズ | マイコミジャーナル

    IE? - IE6, IE7 and IE8 Net Applicationsの報告によれば、2009年9月におけるブラウザシェアはIEが65.71%で過半数のシェアを確保している。バージョンごとにみるとIE6 24.42%、IE7 19.39%、IE8 16.84%となっており、IE6、IE7、IE8のシェアが拮抗しつつあることがわかる。これまでのシェア変動から推測すると、今後数ヶ月の間は3つのバージョンのIEが似たようなシェアを持った期間が続くことになる。IEが第一シェアだといっても、結果的に3つのバージョンに対応する必要がある。 この状況は、特にCSSのサポートという面で厄介な状況を生み出している。IE8はCSS 2.1への高い準拠を実現しているが、IE7はそうではない。IE6はサポートしている要素やプロパティがさらに少ない。またIE7やIE6は対象の要素やプロパティをサポートしてい

    kiyokichi
    kiyokichi 2009/10/19
     :first-childとかIE6のためにこれまで使ったことがない(という言い訳)
  • 【CSS - zoom:1 - ★★★】 - hasLayout問題を解決するzoom:1;の落とし穴 ― Like@Lunatic

    IEのヘンテコなCSS解釈の原因と言われるhasLayoutプロパティ。 どうやらこのhasLayoutプロパティの値がfalse(デフォルト値)の場合に、いろいろとまずいことが起こるようです。IEだけfloatした要素周辺のmarginやpaddingがおかしかったり、相対配置/絶対配置した要素がどこかに消えてしまったりする・・・という経験はcssレイアウトの際に誰もがぶつかる問題です。 また、hasLayoutがTrueとFalseの要素が混在している場合には、IE7のズーム機能を利用した際に、隣あった要素が重なってしまったりします。 この辺はコリスさんのIEでのCSSのバグを回避するhasLayoutに分かりやすい説明があります。 このhasLayoutの問題を解決するためにzoomプロパティが利用されることがあります。(zoomプロパティはIEの独自拡張であるため、これを使うこと自

    【CSS - zoom:1 - ★★★】 - hasLayout問題を解決するzoom:1;の落とし穴 ― Like@Lunatic
  • IEでのCSSのバグを回避するhasLayout | コリス

    IE7で拡大・縮小時にレイアウトが重なってしまったり、IEでフロートした要素がはみ出てしまったりとIE独自のCSSのバグがいくつかあります。 これは、IEのhasLayoutが原因のひとつとなっているので、それを回避する方法を考察します。 hasLayoutとは IEでのCSSのバグを回避するhasLayoutの値 CSSのバグに効果のあるhasLayoutの指定方法 hasLayoutの参考ページ hasLayoutとは hasLayoutとは、オブジェクトがレイアウトを持っているかどうかを示すものです。 hasLayoutの値はread-onlyのため読み込みのみ可能で、falseとtrueがあります。 hasLayoutの値(read-only) false デフォルト値。 オブジェクトがレイアウトを持っていない。 true オブジェクトがレイアウトを持っている。 IEでのCSSのバ

    kiyokichi
    kiyokichi 2007/11/21
     hasLayoutの値をtrueにするには。「display:inline-block」「zoom:1;」「width指定」「height:1%」など。
  • 1