タグ

CSSに関するponki_8のブックマーク (147)

  • Webデザイナー悩ますIEのCSS崩れを事前確認

    「キミのWebサイト、うちの環境だと表示が崩れるんだけど……」 。友人からのこんな指摘に「ちゃんとFirefoxでもSafariでもOperaでもチェックしたのにな」と内心戸惑いつつ、よくよく話を聞いてみると「Internet Explorer 6(IE6)」を愛用中だという。 やられた、IE6はチェックしていなかった! そもそも、自分のWindows XPマシンは「IE7」にアップグレード済みで、IE6はもう入っていない。マシンが何台もあるWeb制作会社ならともかく、個人でしこしことサイトを作っていると複数の環境を用意する余裕はないし、そこまでの手間をかけたくもない。 そこで活躍するのが、「IETester」というツールだ。通常、1つのWindowsで複数バージョンのIEは共存できないが、IETesterはさまざまなバージョンのレンダリングをエミュレートし、指定したバージョンで表示してく

    Webデザイナー悩ますIEのCSS崩れを事前確認
    ponki_8
    ponki_8 2010/02/03
  • ITキヲスク | IE6の頻出CSSバグいろいろと、それに対処するハック術

    CSSコーディングにおいて最も忌むべきもの、それはIE6。 「ホントに仕様書読んで作ったのか?」と疑いたくなるほどのオリジナリティ溢れるCSS解釈は、IE6の絶大なシェアとも相まって、一層容赦ない問題となりました。 世には様々なハック術や回避方法が出回るも、それ自体がIE6のバグを利用したモノだったりして、IE立てればOpera立たず、みたいな状況に脳ミソとろけた経験のある方も多いのではないでしょーか。 今回のエントリーでは、そんなIE6で頻出するCSSバグと、それを対処 / 回避するハック術なんかを取り上げてみたいと思います。 これでもうIE6なんざ怖くない!? IE6の頻出CSSバグと対処ハック術 1.横方向のmarginが倍になっちゃうバグ。 恐らく最も引っかかるであろう、この凶悪なバグ。 このバグに見舞われてしまう条件はものすごくカンタンで、「floatさせた要素に、floatした

    ITキヲスク | IE6の頻出CSSバグいろいろと、それに対処するハック術
    ponki_8
    ponki_8 2010/02/03
  • [CSS]IE6でよく遭遇する6つのバグとその解決方法 | コリス

    CSS Trickのエントリーから、IE6でよく遭遇する6つのバグとその解決方法の紹介です。 IE CSS Bugs That’ll Get You Every Time ボックスモデルのバグ マージンが二倍になってしまうバグ min-width, min-heihgtと同等の指定 Stepdownバグ hover擬似クラスをa要素以外にも対応 透過PNGを透過表示に対応 ボックスモデルのバグ <textarea name="code" class="css" cols="60" rows="5"> div#box{ width:100px; border:2px solid black; padding:10px; } </textarea>

    ponki_8
    ponki_8 2010/02/03
  • (恐らく)最も簡単な、対IE用CSSハック術

    CSSコーディングにおいて最も邪悪かつ驚異的な存在、Internet Explorer。 どんなに完璧にCSSを理解していても、彼らの挙動を把握していない限り、まさに「机上の空論」となってしまうという、恐るべき魔物。 それに立ち向かうべく発明されたのが、各ブラウザの独自仕様やバグの穴を利用して各ブラウザ個別に対応するという、いわゆる「CSSハック」。 今回はワタクシsmknが対IE用として日常的に使用している、(恐らく)最も簡単であろうCSSハック術をご紹介します。 と、その前に...。 今回ご紹介するCSSハック術は、CSSの正式な文法としては間違っています。 バリデート通りません。invalidです。 来なら文法的にも正しいハックを使った方が良いのかもしれませんが、そもそもハックしちゃってる時点で正しいもクソもないような気が、個人的にはしてるので。 さらに、ハックの所為でCSSがバリ

    (恐らく)最も簡単な、対IE用CSSハック術
    ponki_8
    ponki_8 2010/02/03
  • 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は対象の要素やプロパティをサポートしてい

    ponki_8
    ponki_8 2010/02/03
  • Infinity Dimensions Now Rebooting.

    Infinity Dimensions Now Rebooting.

    ponki_8
    ponki_8 2010/02/03
  • IE6でよく遭遇するCSSのバグとその解決方法 | コリス

    Dave Woodsのエントリー「IE6 -CSSのバグとその解決方法」から、IE6でよく遭遇する3つのCSSのバグとその解決方法の意訳です。 IE6 - CSS Bugs and Fixes Explained IE6で、マージンが2倍になってしまうバグ IE6で、hasLayoutプロパティによって起こるバグ IE6で、小さい高さを指定した場合に起こるバグ IE6で、マージンが2倍になってしまうバグ IE6で、フロートした要素のマージンが2倍になってしまうバグと解決方法の紹介です。 下記のコードで、IE6はマージンが20pxになります。 sample:バグ #navigation{ float: left; width: 200px; margin-left: 10px; } #content{ float: right; width: 500px; margin-right: 10p

    IE6でよく遭遇するCSSのバグとその解決方法 | コリス
    ponki_8
    ponki_8 2010/02/03