タグ

CSSハックに関するtadaemonのブックマーク (12)

  • [CSS]クロスブラウザ対応、高さの異なるカラムを揃えるスタイルシート | コリス

    Matthew James Taylorのエントリーから、高さの異なるdivで組んだカラムの高さを揃えるスタイルシートを紹介します。 Equal Height Columns with Cross-Browser CSS & No Hacks demo: 2カラム demo: 3カラム 以前、紹介した「高さの異なるカラムを揃えるスタイルシート」では、ページ内アンカーで要素が消失したり、IEで印刷できないなどの不具合がありましたが、今回紹介するものは、その2つの不具合が無いものとなっています(IE7調べ)。 対応ブラウザは、IE5.5, 6, 7, Fx1.5, 2, 3, Op8, 9, Safari, Google Chromeなどほとんどのものに対応しています。 仕組みはカラムごとにdivを用意し、それぞれをずらして配置します。 下記は、そのイメージです。

  • IE6以下をIE7と同じようにするライブラリ『IE7.js』

    IE6以下をIE7と同じようにするライブラリ『IE7.js』 Check Tweet 配布元:Google コード(ie7-js) ライセンス:MIT License IE7.jsはIE6をIE7に近づけるJavaScriptライブラリになります。 IE7には実装されているがIE6以下には実装されていない様々な機能をIE6以下で利用することが可能になります。 設置方法 Google コードより直接読み込むことが可能です。 以下をhead要素内などで記述します。 <!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/xx.x/IE7.js" type="text/javascript"></script> < ![endif]--> xx.xはバージョン情報(現在のバージョンは『2.0(beta3)』)

  • IE7CSS問題のまとめと対策

    はてなブックマークで知ったんですが、Internet Explorer7のCSS問題がまた注目を浴びてるんですね。 はてなブックマーク » 過去の人気エントリー 2006年05月23日 Internet Explorer 7ベータ2の不具合からWebデザイン業界の混乱が見えてきた このブログでも以前に、Internet Explorer 7で使えなくなるCSSハックでIE7のCSS実装について取り上げましたが、頭の整理のためIE7を取り巻くCSS問題と処方箋についてまとめてみました。 原因 Internet Explorer6:CSS実装にバグあり+未対応多数。Quirks modeとか。 Modern Blowser(FireFoxとかSafariとか):標準的なCSS実装。Standard mode。 →ウェブ製作者:IEだけが解釈するようにCSSハック導入 ↓ MS:IE7は標準的な

    IE7CSS問題のまとめと対策
  • W3C CSS 検証サービス

    URLで指定して検証 検証したい文書(CSSと組み合わせたHTML文書、もしくはCSS単体の文書)のURIを入力してください: アドレス: オプション

  • CSSで中央配置(センターリング)する方法 | CSS Lecture

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • IE6とFireFoxで知っておくべきmarginに関するCSSハック | ユージック

    IE6とFireFoxで知っておくべきmarginに関するCSSハック 2006年8月18日 今回はコーディングでよく悩まされるIE6とFirefoxでのmarginに関するCSSハックをご紹介します。 たとえば何かのブロック要素をfloatで右か左どちらかに寄せてしまうと、marginのautoが効かなくなります。 その場合は、普通にpxで幅のmarginを合わせることになります。 しかし、IE6とFireFox(FireFoxでなくてもW3C推奨ブラウザ)ではmarginの解釈が異ます。 例えば、左右に10pxをとるとすると、IE6では左右に20pxづつmarginをとったように表示され、レイアウト崩れが生じてしまいます。 これはIE6がCSSに完全に対応していないために起こる現象なので、けっして自分の失敗ではないということを知っておかなければなりません。 対処方法として、IE6だけに

    IE6とFireFoxで知っておくべきmarginに関するCSSハック | ユージック
  • (恐らく)最も簡単な、対IE用CSSハック術

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

    (恐らく)最も簡単な、対IE用CSSハック術
  • IE5.5, IE6, IE7, IE8の確認が同時にできる -IETester | コリス

    IETesterは、IE5.5, IE6, IE7, IE8beta1の確認が同時にできるアプリケーションです。 IETester [ad#ad-2] IETesterを利用するには、上記IETesterのページの「Download IETester」から「install-ietester-v0.2.exe」ダウンロードし、IETesterをインストールします。 IEのバージョンの切り替えは、「New Tab」から切り替えることができます。 簡単に使用しただけですが、IE5.5, IE6, IE7, IE8beta1のレンダリングの違いを確認できました。 バージョン0.2の動作条件は、Windows XP or Vista + IE7以上となっています。XP + IE6の場合、IE7, IE8のモードが動作しません。 Windows XP + IE7, IE8beta1の環境で使用したとこ

  • スタイルシートによる崩れない 2カラム 3カラム・レイアウト

    このウェブサイトは販売用です! desperadoes.biz は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、desperadoes.bizが全てとなります。あなたがお探しの内容が見つかることを願っています!

  • ADP: floatレイアウトでつまづかないためのTips

    ADP: floatレイアウトでつまづかないためのTips
  • CSSレイアウトの定石 WinIE6バグ回避法

    CSSを使ったレイアウトをする際にWinIE6のバグを回避するための「定石」をまとめておきます。 とくに重要だと思うものは強調してあります。参考としてバグ辞典へのリンクも用意しました(つまり回避法を用いない場合にどんなバグが発現するか)。 フォントサイズ関係 font-sizeは%かpxで指定する。 キーワードで文字サイズを指定すると標準モードと互換モードで文字サイズが変わる(IE6) em単位で指定した値が文字サイズ変更後に正しく反映されない(IE6) ボックスモデル関係 widthと同時に左右borderや左右paddingを指定しない。heightと同時に上下borderや上下paddingを指定しない。 ボックスの幅や高さを算出するときにパディングやボーダーのサイズを含めてしまう (ブロックレベル要素を内包するボックスにはpaddingを指定しない。) 左右ボーダーとパディングを設

  • IE共通の9つのCSSバグをそれぞれ解決する方法:phpspot開発日誌

    IE共通の9つのCSSバグをそれぞれ解決する方法がNettutsにて紹介されています。 どれも、なんでだろうと頭を悩ましそうな問題なので解決法を知っておくと簡単に対処できそうです。 1. センタリングが効かない問題 margin: auto を指定した場合の期待する結果 IEの場合以下のようになりますが↑にするための解決法が書かれています 2. 横に並べたいリストが階段状になってしまう IEの場合以下のようになってしまいますがこの解決法も記載されています 3. ダブルマージンフロートバグ マージンの指定が期待通りに出ている例 ↓ IEの場合、margin: 30px 0 0 30px;  で定義した値が正しく適用されない例も解決法があります 4. heightの高さ指定が効かないバグ height:2px を指定した場合の想定する表示 IEはなぜか2pxにならないのでこれも解決法が示されて

  • 1