サイトタイトルに影をつけたい

質問

サイト全体に雰囲気を出したいのでサイトタイトルに影をつけたいと思っています。

そこでcssに

text-shadow: 1px 1px 3px #000080;

として追記してみたのですが反映されません。ブラウザはIE9です。以下は記述です。

#header h2 ,#header .title {
text-shadow: 1px 1px 3px #000080;
width: 550px;
font-size: 36px;
line-height: 36px;
position: absolute;
left: 20px;
top: 35px;
<% pageTitleFontSize %>
<% pageTitlePlace %>
}

#header h2 a, #header h2 a:visited,#header .title a,#header .title a:visited {
color: #5BA20D;
text-decoration: none;
<% pageTitleColor %>

記述の仕方がわるいのでしょうか？それともブラウザ自体の問題なのでしょうか？分かる方いましたら御指導いただけるとうれしいです。

よろしくお願いします。

回答No.1

naokita · ベストアンサー

#header h2 ,#header .title {
filter: progid:DXImageTransform.Microsoft.Shadow(color=#0000FF,direction=45);
}

IEだけの話なら簡単に各種filterで良いかな。

残念ながら、
text-shadowは、CSS3だから、IE8以前は全く対応していなくて、
IE9から対応なんだけど、まだまだ不完全であって、
text-shadowは未対応なのです・・・

１、IEの独自フィルターってのが各種あって「IE filter」で検索
２、「IE CSS3ライブラリ」で検索
３、画像化する。

独自仕様＆次期早々なので、あまり使わないですね。
あと、数年経てば皆が利用するようになるかな。

お礼

連絡おけれてしまい申し訳ありません。

IE9もtext-shadowは未対応なのですね

一度教えていただいた方法で編集してみます。ありがとうございました。