有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE（Internet Explore）のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー
有限会社タグパンダ 喜安 亮介 2009/11/17 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） Webブラウザ別CSSハック一覧表 前回の「IE 6で泣かないための、9つのCSSハック」では、仕様通りの正しいコーディングを行っているにもかかわらず、Internet Explorer（以下、IE） 6で見ると、レイアウトがズレてしまうなどのさまざまな問題を解決するための9つのテクニックを紹介しました。 今回は、IE 6とIE 7のためのCSSハックのテクニックを下記に分けて紹介します。 IE 6をハック（IE 6のみに効く、もしくはIE 6のみに効かないハック） IE 6のみに効くハック スタ
有限会社タグパンダ 喜安 亮介 2009/12/16 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） モダンブラウザとMac OS XのIE 5でも使えるCSSハック 前回の「IE 6とIE 7のためのCSSハック16選」では、IE 6とIE 7のためのCSSハックのテクニックを紹介しましたが、今回は、モダンブラウザでも使えるCSSハックのテクニックを下記に分けて紹介します。 IE 6/7/8をハック（IE 6とIE 7、IE 8に効く、もしくはIE 6とIE 7とIE 8に効かないハック） IE 6とIE 7、IE 8に効くハック コンディショナルコメント ユーザーエージェントハック IE 6と
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.
October 11, 2010: Reported on the front page of the New York Times Find the latest details, code, and implementations on github @ https://github.com/samyk/evercookie DESCRIPTION evercookie is a javascript API available that produces extremely persistent cookies in a browser. Its goal is to identify a client even after they've removed standard cookies, Flash cookies (Local Shared Objects or LSOs),
連載インデックス 「Webブラウザ別CSSハック＆フィルタTips」 Webブラウザの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのさまざまなCSSハック＆フィルタTipsをお届けします IE 6で泣かないための、9つのCSSハック Webブラウザ別CSSハック＆フィルタTips（1） Webブラウザの違いにより起こるレイアウトの表示ずれ問題。ユーザーの多いIE 6での問題を解決するテクニックを紹介します
概要 Firefox 1.0 以降用, Firefox 1.5 以降用, Firefox 3.0 以降用の CSS ハックの手法とその仕組みの説明です。 動作確認用の demo 説明 複数のセレクタに同じ宣言を共有する場合、h1, h2, h3 { font-style: bold } のようにセレクタをカンマで区切ってグループ化 (Grouping) することができます。 しかし、グループ化したセレクタ群の中に、Web ブラウザが未対応のセレクタが一つでも含まれている場合、グループ化した別のセレクタも無効化されてしまい、グループ化した全てのスタイルが適用されなくなります。 例えば、h2, p:first-child { font-weight:bold } のように宣言した場合、h2 要素と最初の子要素の p 要素が太字でレンダリングされます。しかし、IE 6 では :first-chi
JavaScriptを理解する
java script を理解する。。。 愛用本 詳解 HTML & JavaScript 辞典 IE でしか動かない物が多いと思いますので Using the W3C DOM もチェックして修正してください。 算術演算子 演算 演算子 加算 + 減算 - 乗算 * 除算 / 剰余算 % 代入演算子 演算子 意味 = 代入 += 足して代入 -= 引いて代入 *= 掛けて代入 /= 割って代入 %= 割った余りを代入 単項演算子 演算子 意味 ++ １足す -- １引く - 符号の反転 関係演算子 演算子 意味 > 大きい時 >= 以上 < 小さい時 <= 以下 == 等しい時 != 等しくない時 真と偽 真は true 偽は false 論理演算子 演算子 意味 && (and) 比較対象が真ならば真、それ以外ならば偽 || (or) 比較対象のどちらかが真ならば真、それ以外は偽 ! (
【CSShack/ＣＳＳハック】いつie7リリースがあってもこれで大丈夫！なハック::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
Operaだけってのが見つけられなかったので、エントリーかいてみました。といっても他のCSSハックの複合技でOperaだけ普通に表示させているだけです。しかも「ほぼ」で完全にではないんです。今回やりたかったのはOpera9.x系統、firefox3.x、safari3.x、IE5.5〜6、IE7をCSSで区別したかっただけで、ネタ用なんでまじめにレイアウト調整などするなら回りくどいことしなくていいと思います。多分それ以外のブラウザを使っている人はどんなに他のブラウザ進めたって乗り換えたりしないでしょ。レイアウト崩れとかどーでもいいんでしょ。 事前準備として、HTML側の構成はOperaブラウザで閲覧すると「Operaサイコォオー」と表示され、それ以外のブラウザでは「Opera使いなさいよぉ！」と表示させることにします。 <html> <head></head> <body> <div cl
「min-height」をIE 6で実装する場合も「インポータントハック」を使用します。 まず、先にモダンブラウザへの記述を書き、その下に「min-height」と同じ値を「height」に記述します。IE 6はボックスが中身に応じて拡張するため、100px以下のときは100px。それ以上のときは、その中身のサイズになります。よって、「min-height」と同じ挙動になるということです。 ■ 構文 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" conte
はてな | 00:05 | えー、前回 多数の皆様から！？ブクマいただいた ので、性懲りもなくまた書きます。 例によって以下をご一読ください。はてなブックマーク - ヘルプ - 注意事項：エントリーのタイトル変更に関する注意事項対象のページにタイトルが設定されていない場合、記事のタイトルが取得できない場合(ブログそのもののタイトルは取得できたが、記事のタイトルが取得できない場合)など、他のユーザーにとってもタイトルが変更されることが望ましいと判断できる場合にのみ変更し、極力オリジナルのタイトルを尊重してください。はてなブックマーク - ヘルプ - 注意事項：エントリーのタイトル変更に関する注意事項 てなことを踏まえて、、、いってみましょうか。 BADSTRINGシリーズ とにかく BADSTRING というタイトルに。なんかツールでも使ってるんすかね。ブクマした結果は自分で確認してくれませ
IE 7やMac OS XのIE 5に適用します。使用方法は、適用させたいセレクタの前に「*+html」を記述するだけです。 スターハック（* html）から考えると、全称セレクタ（*）は親要素ではなく、兄弟要素として認識するため、IE 7では適用されると考えられます。 しかし、Mac OS XのIEや古いタイプのOperaでも認識されてしまうため、IE 7スターハック（*:first-child+html）が作られました。こちらのハックは、IE 7のみに適用可能です。 ■ 構文 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <he
有限会社タグパンダ 喜安 亮介 2009/11/17 スターハック Star HTML Selector Bug Star HTML Hack IE 6とMac OS XのIE 5に適用します。使用方法は、適用させたいセレクタの前に「* html」と記述するだけです。スター（*）を適用するので、「スターハック」と名付けられました。 適用したいセレクタの前に「* html」を記述することで実装できます。そのほかのモダンブラウザは「HTMLには親要素がない」と解釈し、「この記述は間違っている」として適用しません。 しかし、IE 6やMac OS XのIE 5は、それを正しいと認識し、適用してしまいます。このハックは、IE 6のズレを直す際によく使われるハックです。 ■ 構文 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "ht
SAWAMEMO
SAWAMEMOは新サイトへ移行しました。
CSSハック一覧 -よく使うものをメモ- 【IE6、IE7、IE8、IE9、Firefox、Safari、chrome、Opera】 | MITAMA DESIGN
blogトップ > HTML / CSS > CSSハック一覧 -よく使うものをメモ- 【IE6、IE7、IE8、IE9、Firefox、Safari、chrome、Opera】
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.
有限会社タグパンダ 喜安 亮介 2009/10/8 【7】リサイズ時にずれる この問題は、親要素に「position: relative;」を追記することで修正できます。このように記述することで、親要素を基準として配置できます。 ■ 構文 body { margin: 0 auto; width: 500px; height:500px; background:#ccc; position: relative; } p { background:#f00; position: relative; } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/x
Protolize.org - Essential web tools in one place This is a place where web designers and developers collaborate to create an ultimate collection of web-tools. Only the most useful and current tools will be considered to be on the list.便利Web2.0ツールへのリンク集、Protolize.orgの紹介。 ここで発見した便利サイトを軽く紹介。 TechCheatSheet.com … チートシートのタグ付けリンク集 CSSHackブラウザ対応表 こういうリンク集もいいですね。
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.
Moz Any Link Hack IE 7やFirefox、Mac OS XのIE 5に適用します。使用方法は、IE7、Firefox、Mac OS XのIE 5に適用させたいセレクタの後に「, x:-moz-any-link, x:only-child」を記述するだけです。「moz」が付いているのは、Mozillaの独自拡張です。 独自拡張なので、W3C CSSバリデーションには通らず、文法的には正しくありません。「-moz-any-link」というのは「:link」「:visited」にマッチします。Firefox 3にも対応しています。 ■ 構文 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml
IEに適用します。使用方法は、IEのみに適用したい<style>タグの前後に、「<!--[if IE ]>」「<![endif]-->」を記述するだけです。バージョンごとの振り分けも可能なので、より詳細な指定にも対応できます。しかし、Mac OS XのIE 5には対応していません。 また外部CSSの読み込みにも対応していて、一般的には<link>要素を囲む形で記述されます。 ■ 構文 <!--[if IE ]> <style type="text/css"> p { color: #f00; } </style> <![endif]-->
「 linkage.xrea.jp 」のページは、ドメインが無効な状態です。 ウェブサイト管理者の方はこちらから変更・更新を行ってください。 「 linkage.xrea.jp 」is Expired or Suspended. The WHOIS is here.
週刊Webテク通信 2009年10月第2週号1位は、さんざん乱用されたWebデザインのトレンド／気になるネタは、落書きから写真を合成!? PhotoSketch ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2009年10月5日?10月11日の間に見つけた記事のベスト5です。 1. Most Used and Abused Web Design Trends of All Time | Web Design Ledgerhttp://webdesignledger.com/tips/most-used-and-abused-web-design-trends-of-all-time これまでにさんざん乱用されたWebデザインのトレンドを紹介した記事です。 流行を振り返ることにより、自分なり
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.
【CSShack/ＣＳＳハック】いつie7リリースがあってもこれで大丈夫！なハック::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
CSS Hackまとめ 特定のブラウザに外部スタイルシートを読み込ませない Netscape 4.xに外部スタイルシートを読み込ませない link要素のmedia属性に「screen」以外の値を指定する。 <link href="sample.css" rel="stylesheet" type="text/css" media="screen, print"> <link href="sample.css" rel="stylesheet" type="text/css" media="all"> IE 4.x/WinとIE 4/Macに外部スタイルシートを読み込ませない @import命令を使って外部スタイルシートを読み込む際に、下記の書式でURLを指定する。 @import "sample.css"; ※この方法でNetscape 4.xも除外できるが、@import命令を使うと一
Elastic Layout
概要topElastic Layout 弾性レイアウト このドキュメントは、www.tenman.infoが、エラスティックレイアウトの習作を行う為に集めたbookmarkや覚書を公開しているものです。 Elastic Layout いろいろな手法で、スタイルは設計されますが、最も簡単で、コストのかからないスタイルの設計を、明確に出来る人は少ない。 スタイルの指定は、ブラウザ毎にそれぞれ、汎用的な手法だけでは、対応がつかないことも良くあり、CSShackと呼ばれるブラウザのバグ等を頼りにした対症療法が行われる為だ。 CSS2 附属書A HTML4.0のスタイルシート例等W3Cのスタイルシートなどを、見てみても、見慣れたリキッドレイアウト用のパーセント指定や、固定レイアウトの時によく使うpx単位は、それほど使われていない。 多いのはemという単位。ベースフォントの幅、高さに対して、相対的な
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IE 6で泣かないための、9つのCSSハック (1/3) - ＠IT
IE 6とIE 7のためのCSSハック16選（1/3） - ＠IT
モダンブラウザでも使えるCSSハック18選（1/3） - ＠IT
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
Samy Kamkar - evercookie - virtually irrevocable persistent cookies
連載インデックス「Webブラウザ別CSSハック＆フィルタTips」 - ＠IT
Firefox 1.0, 1.5, 3.0 用の CSS ハック | ヨモツネット
Operaだけに適応させたいCSSハック - MOMIZINE
IE 6で泣かないための、9つのCSSハック（2/3）- ＠IT
[He] - 続・これはひどい「はてブ“タイトル”」ですね
IE 6とIE 7のためのCSSハック16選（3/3）- ＠IT
IE 6とIE 7のためのCSSハック16選（2/3）- ＠IT
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
IE 6で泣かないための、9つのCSSハック（3/3）- ＠IT
便利Web2.0ツールへのリンク集:Protolize.org:phpspot開発日誌
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
モダンブラウザでも使えるCSSハック18選（3/3）- ＠IT
モダンブラウザでも使えるCSSハック18選（2/3）- ＠IT
linkage.xrea.jp is Expired or Suspended.
2009年10月第2週号 1位は、さんざん乱用されたWebデザインのトレンド／気になるネタは、落書きから写真を合成!? PhotoSketch | gihyo.jp
http://www.jaist.ac.jp/~m-tamura/article/web/css/csshack
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
CSS Hackまとめ/特定のブラウザに外部スタイルシートを読み込ませない
http://www.cubic4.net/web/37-css/52-csshack.html