IE8 white-space:nowrapが他の要素にも適用されるバグ

TABLE内でwhite-space:nowrapを指定したSPANの先頭にINPUTがあるソースで、white-space:nowrapが他の要素にも適用され、横に長くなってしまったときの回避策。
>>IE8 white-space:nowrapが他の要素にも適用されるバグ
posted by digital-squad at 2010年01月16日 19時14分 | Comment(0) | TrackBack(0) | CSS

IE6のバグ?文字コード指定しないとCSSを無視する事が。

 IE6のみ特定のクラス(ID)のCSSが適用されないので、色々と探っていたところコメントを日本語で書いていた箇所を英語にしたり、日本語でもコメントの内容を変更したら適用される、というような事があった。

 どうやら、UTF-8のHTMLにShift JISのCSSを読み込ませていて、CSS側では文字コード宣言を何もしていなのが問題だったようで、CSSの文字コードをUTF-8にして、文字コード指定をしたら解決。

しかし、現象を再現することができなかったために、結局のところUTF-8にShift JISのCSSを読み込ませたのが原因なのか、はたまた文字コード宣言をしていなかったからなのかなどははっきりと分からなかった。

うーん・・・腑に落ちない。

【教訓】文字コード指定はちゃんとしよう。

参考:文字コード宣言は行いましょう(CSS)

関連記事
タグ:IE6 CSS
posted by digital-squad at 2007年06月13日 13時30分 | Comment(2) | TrackBack(0) | CSS

IEで擬似クラス:hoverを<a>タグ以外にも有効にする方法

 IEで擬似クラス:hoverがaタグ以外で反応してくれなくてお困りのアナタ(主に昨日までの自分)におとどけするハック

 結論からいいますと、CSSのみでは不可でビヘイビアファイルを読み込ませる(Javascript)事で解決する方法です。
それではレッツ解説!(主に忘れっぽい自分へ)

ステップ1. ビヘイビアの配布先からファイルをダウンロード
ie_hover.gif


ステップ2. ビヘイビアファイルを読み込む
body { behavior:url("csshover2.htc"); }
※urlのパスは、HTMLからみたパスにします。

これで全ての要素にhoverが有効になります。

ステップ3. おしまい

この方法は簡単なんだ。

どうしてもステップ4が必要なアナタ

ステップ4. コーヒーを飲む を追加して下さい。
タグ:IE CSS
posted by digital-squad at 2007年06月08日 15時42分 | Comment(0) | TrackBack(0) | CSS

フォームボタンのビジュアルをデザインする

フォームの送信ボタン(submit)は、通常<button type="submit">Submit</button>とマークアップしますが、これがSafariではCSSが適用されなかったりするので、これをbuttonタグでマークアップしてビジュアルを変更するというもの。

リンク先のソースでは、透過PINGを使っているためIE6で透過されていなかったり、IMGタグでマークアップしているデザイン要素は背景イメージで代用できそうだったりするのですが、IE、Firefox,Safariそれぞれでかなりビジュアルを統一できているのは見事です。
Rediscovering the Button Element
タグ:CSS Firefox safari
posted by digital-squad at 2007年05月24日 23時46分 | Comment(0) | TrackBack(0) | CSS