IE9では、CSSだけで背景画像にグラデーションの記述を指定した綺麗なボタンが表示できませんでした。
しかし、同じような問題は誰かが解決策を見い出している事が多いので、Webで検索。
以下のブログに解決策がありました。ありがとうございます。^^
参考にさせていただいたブログはこちら。
(・・・知らぬ間に、リンク切れになってしまいました。)
IE9で背景画像にグラデーションを設定するには背景画像に画像ファイル(SVGファイル)を指定して対応するとのこと。・・・時代に逆行してるような・・・
画像記述用のファイルですが、実際のSVGファイルの中身は、テキストなので、今回のようなグラデーションを実現するだけなら、記述も数行で済み、サイズも小さいので、軽快に表示され問題ないようです。
参考にさせていただいたブログ上のボタンを押して、SVGファイルの記述をコピー&ペーストしたところ、ウエブ表示上の問題からか、「”」(半角)であるべきところが、「”」(全角)になっていました。
取り込んだ後に、全角→半角に置き換える必要があります。
・・・これに気づくのが遅れて、しばし、悩みました。^^
これで、なんとかIE9でボタンがまともに見られるようになりました。
PS:
IE8以前ではどんな風に表示されるのだろうか・・・。ちょっと気になってきました。
完璧をめざすのもほどほどに・・・その内余力ができたら確認環境を用意しましょう。