IE でどうにかして color:inherit を有効にする
IE でどうにかして color:inherit を有効にする 2008-03-22-1: [CSS][JavaScript][jQuery] IE (6 も 7) では、CSS の color: inherit に対応していないので、以下のような場合に他のブラウザと異なる表示になります。 * { color: #000; } p { color: #f00; } span { color: inherit; } <p><span>ここは color: inherit を指定しています。</span></p> - Internet Explorer 6.0 - Firefox 2.0.0.12 見て分かるとおりに、IE の場合は、ユニバーサルセレクタで指定した #000 が有効になっています。 要は、CSS 2 に準拠していないということなのですが、これをどうにかして他のブラウザのように
ウェブコンテンツ・アクセシビリティ・ガイドライン 1.0
E-mailｼ嗹ebmaster@zspc.com Copyright © 1996-2000 ZSPC. All Rights Reserved. All pages except color chart are written in Japanese. g src="/static/zspc.com-vcss.gif" alt="Valid CSS! | " height="31" width="88" border="0"> g height="31" width="88" src="" alt="Level A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0" border="0">
ようやく改行が直りました
フォーキー☆カーニバル 中津川を知らない、遅れてきたフォーク小僧の脳内お祭り騒ぎ日記。 高田渡ゆかりの武蔵野より、平凡な日常と小さな幸せを歌います。 パソコンでこの日記を見ている方の大半が、WindowsのInternet Explorerを使っています。 「なんでこの日記は改行がないのか」 「読みにくい」 と思われた方も多いと思います。 でも実際は、文章を読みやすくするために、ところどころに空行を入れていました。 IE以外のブラウザー、たとえばFirefoxやOperaでは、空行は正しく表示されました。しかし、大多数のユーザーが使用するIEだけが、入れたはずの空行が表示されなかったのです。 今日、ようやくその原因が分かりました。 この日記では、文章を読みやすくするために文字と文字の間に1ピクセル分のスペースを空けています。 専門的な話になりますが、ブログの本文にあたる部分について、スタイ
CSS Message Boxes for different message types : Janko Jovanovic
Can you believe this: Few days ago I went to my bank to check my credit score with the Credit Bureau. The bank official typed in my personal data and sent a request. Web application responded by displaying a yellow message box with an exclamation icon saying that data processing is still in progress. He checked several more times, but he didn't notice that at one moment the message changed to "Acc
Programming Magic is under construction
Thank you for being patient. We are doing some work on the site and will be back shortly.
NexTech >> SELECT BOXの上にレイヤーを置くには
WindowsのブラウザでSELECT BOXの実装方法がWindow Controlをそのまま使っているのが原因でz-indexとかでいくら頑張っても最上位にSELECT BOXが表示されてしまう。回避方法はSimと言われるiFremeを追加する方法がある Simの上にDivを置くためには要素をabsolutteしたDIVをzIndexを上位にして重ねる。 Absoluteにしないと上に載せることができない。 // シム（プルダウンが透ける問題対策）作成・表示 function SimView(elem){ //取得or作成 if(document.getElementById(elem.id+'Sim')){ Sim = document.getElementById(elem.id+'Sim'); } else { //シム作成 var Sim = document.createEl
Easy CSS Progress Bar | Kollermedia.at
A pure and free to use CSS “Step by Step” Progress Bar for all CSS Junkies out there. There is no limit of steps, just add another li tag and adjust the witdh in the css li part. Example Check out a few live Examples Tested in IE6, IE7, Latest Firefox and Opera Version Download Easy CSS Progress Bar (2,5 KiB, 4.569 hits)
CSSバグリスト＠CSSバグ辞典スレッド
『CSSバグ辞典スレッド』の要約 ここは、2ちゃんねるweb制作管理板内のCSS/DHTMLのバグを扱うスレッドで挙げられた、各ユーザエージェントのCSSやDHTMLの実装上のバグをまとめているサイトです。 更新履歴 WinIE171, 172、NN031、Opera091を追加。WinIE151を修正。（2004-11-29） WinIE169, 170、Moz085を追加。WinIE030, 039、Moz070、Opera048を修正。（2004-10-09） NN029, NN030、Moz084を追加。Moz033を修正。（2004-08-23） WinIE168、Moz082, 083を追加。WinIE022, 166を修正。（2004-08-08） Moz081、Opera090、Safari022, 023を追加。（2004-07-26） 以前の履歴 本拠地スレッド CSS
カラーコード HTML・CSS用
Webデザイン用のプチツール 選択したデザインパターン上でブロックの色を変えことができます。選択したブロックのカラーコードも表示されます。 配色保存用アドレス機能 あなたの作った配色をブログやメールで紹介することができます。パレット右上の「保存用URL表示」をクリックするとURLが表示されますのでコピペしてご利用ください。 配色のヒント 雑誌や生活雑貨を参考にする 本文が読みにくい配色はさける。 同系統の色でまとめてみる。 同じぐらいの彩度でまとめてみる。 WEBデザインのヒント 重要なナビゲーションは、探せばすぐに見つかるように配置する 色、文字の大きさ、ブロック周りの余白を調整すると、目立つようになる ページを開いて、まずどこに目がいくのかを意識する 関連のある情報を固める 関連性の薄い情報ブロックの間には余白を入れる
Internet Explorer (Windows) CSSバグリスト
ここにはWindows版Internet Explorer4.0以降（WinIE）のCSS/DOM実装バグの一覧があります。以下のリストからそれぞれのバグの詳細を見ることができます。 WinIEのCSS実装 WinIE6.0以降に「DOCTYPEスイッチ」が実装されています。DOCTYPE宣言により、W3Cが策定したCSS仕様に従う「標準モード」か、過去のUAに実装されていたCSS仕様に従う「互換モード」で解析・描画が行われます。 DOCTYPE宣言なし： 互換モード HTML3.2以前： 互換モード HTML4 Transtional/Frameset（システム識別子なし）： 互換モード HTML4 Transtional/Frameset（システム識別子あり）： 標準モード HTML4 Strict： 標準モード XHTML（XML宣言なし）： 標準モード XHTML（XML宣言あり）
2xupで実装されているエラスティックレイアウトを調べてみた。 - Trans
2xupさんのところで実装されているエラステックレイアウト（Elastic Layout）、もしくはエラステックデザイン、はたまたエラスティックレイアウトというのが気になってしょうがない。今年、アックゼロヨンでグランプリを受賞したみずほ証券でも、似たようなレイアウトが施されている。というわけで、またもや調べてみた。 と、調べてみたはいいものの、うまい具合に実装方法について解説されているサイトが見つからなかった。要は、widthやpadding、marginなどにem指定をして、フォントサイズを変更しても、それに応じてレイアウト幅が変更されるレイアウトのことを言うらしい。A List Apart: Articles: Elastic Designで発表されたのがどうも初めてのようだ。ちなみに、作者が作ったサンプルサイトもある。 でも、456 Berea Streetでよい感じに、自分のサイト
【IE7対応clearfix】さらに続報、コピペでつかえる主要ブラウザをclearするコード、[多分最終版]::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
ブラウザで読みやすいフォントとは
フォントには様々な種類がありますが、画面上で一番読みやすいフォントは、「Verdana」フォントだと思います。 当ブログでも「Verdana」フォントを使用していますが、「Verdana」フォントは、MTの初期設定では第一指定されています。また、他のブログサービスやWebサイトでも非常によく使用されていますね。 では、なぜ、「Verdana」フォントがよく使用されているのでしょうか？ そこで、今回は、「Verdana」フォントについて調べてみましたので、是非、参考にしてください。 ■ Verdana フォント 「Verdana」フォントは、 「画面上での見た目、読みやすさ」を基準として 1996 年にデザインされた比較的新しいフォントです。Windows に標準でインストールされていますので、ほとんどのユーザー環境に対応しています。 < 表示例 > フォントの特徴として、文字
CSSのfont-family：ヒラギノとＭＳ Ｐゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New Roman」になってしまう。※文字コードがShift_JISやEUC-JPの場合はデフォルトのフォントで表示される。 それでは例えば総称ファミリー名（generic-family）である「sans-serif」のみ指定してみると、WindowsのIE6では文字コードがShift_JIS・EUC-JPの場合は「Lucida Sans Unicode」で、UFT-8の場合は「Arial」で表示されてしま
CSSのみでスライドメニュー作成
CSS MENUS › CSS only fly-out menus - further examples Date : 11th June 2006 For all modern browsers This demo is too wide for your mobile screen. Please view on a tablet or PC. Menu #1 Home Products Mobiles Photoframes Tripods Memory cards Cameras SLRs Compact Digital Video Camcorders Accessories Services Photography Video editing Web site Design and Hosting Reference guides Tutorials Contact us S
CSSで角丸を実現する
ブロック要素に角丸を使うことができれば、デザインの幅も広がります。でも画像を使うのは面倒だし・・・悩んでいていろいろ調べてみたらCSSのみで角丸を実現する方法が書いていたんです。ということで、備忘録代わりにここに記すことにします。いやー、スタイルシートって奥が深い。こんな方法思いつかなかったよ。でも<span>の中は空っぽなのでHTMLの文法的にはアウトかもしれませんね（汗 HTMLソース <div id="text-sample"> <!-- フタ --> <span class="rtop"> <span class="r1"></span><span class="r2"></span><span class="r3"></span><span class="r4"></span> </span> <!-- フタ --> <!-- 中身 --> <p class=
CSSデザインカタログ | block | 見出し部分を画像にした角丸の枠
h3，pとulによるリストを含む テキストテキストテキストテキストテキストテキストテキストテキストテキスト 項目1 項目2 項目3 項目4 ソース XHTML <div class="div042-hpl"> <h3><img src="img/hd-div042-hpl.png" alt="見出し部分を画像にした角丸の枠 : div042-hpl" /></h3> <p>h3，pとulによるリストを含む</p> <p>テキストテキスト......</p> <ul> <li>項目1</li> <li>項目2</li> <li>項目3</li> <li>項目4</li> </ul> </div> CSS div.div042-hpl { margin: 1em 0; width: 570px; background: url(../block/img/bg-roundcorner.png)
Spiffy Corners - Making anti-aliased rounded corners with CSS
Anti-aliased rounded corners using pure CSS. No Images. No Javascript. No fluff.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]複数のチェックボックスを小さいスペースにまとめるスタイルシート
CSSのfont-familyに“メイリオ（Meiryo）”を追加してみた。 - Hato-Style - Note