2009年1月17日土曜日

IE8ってIE7とまたまた全然違うCSS メニュー改善

IEは見え方が違う。 IE6は全然違う。


<!--[if IE]>
<link rel="stylesheet" type="text/css" href="hack.css">
<script type="text/javascript">window.mlrunShim = true;</script>
<![endif]-->


とハックしたら、IE8で見ると、違う!

で、結局、IE8はハックしない方がいいらしい。

こんな情報もあるみたいですが、これがわかりにくい!マイクロソフトがんばれよ

<!--[if lte IE 6]>
と書いたら IE7はどう書いたらいいのかわからない。

いろいろ読むけど、結局、hack.cssの中に

さらに、

*+html「IE7」

* html 「IE6」 とさらにハックしないといけない。


で、
最初の行にIE8での動きを書いて、
IE6と IE7でこうしてくださいと2回書かないといけない。同じものを。

IE7以下という表現をご存知の方は教えてください。


今まで愛用していたJavaScript を使ったかわゆいメニューを加工して、バック画像に文字のせで作ってきたのですが、IE8だと崩れるので今回、まだお客様が気がついてないうちに1日ほど考えてしまいました。

もう、jqreryにしたいんだけど。 jqueryでフェイドとかがないとイヤなんだよ。
いろいろ探すがこれはと思うものがないのね。 自分で作る能力もなく…。

ものすごく考えました。

結局、.horizontal li ul をハックするだけでよかったのですが、

これをもう一回作れと言われた私は倒れるので、パソコン壊れてもいいようにアップしておきます。

見本はこちらです。

ちなみに、なぜか私が加工したときにjs.jsにエラーをIE8は言うてくるため、思い切ってエラー部分を削ったらいい感じになった。

もう、深く考えるのはやめましょう。


理想が高いわけではないと思うが、このこだわり性格をなんとかしたい。

でもなぁ。ほんまにこれはと思うメニューが作れないわ。

このメニューの動きも決して最高にいいとも思えない。IE8の動きはぎこちないし。

jqueryで作りたいけどなぁ。

これなんか応用して画像で作れないだろうかと思うけど有料なのがちょっと?

これもいいかも

とにかくいっぱいあるけど、応用できないから困るんだよ

本当に、jqueryがんばらんとなぁ。


CSSの鉄人にならないといけないのだろうかと。こんなサイトを見ながら思いました


****

今日、SRware Iron というブラウザを初めて使ってみました。 優秀です!超安定。サクサク。  教えてくれたのはこちら!ホームページを作る人のネタ帳

ありがとうございます。 毎回力の入った文章で、あなた様は何者と思っていつも読んでます。


************************************:
2009年1月29日にIE8の製品版ひとつ前というのを入れてみましたら、
レイアウトの崩れが治っていました!

なんですか? うれしいけど。 びっくり。



***************
<!--[if IE]>
<style type="text/css">
@import 'iestyle.css';
</style>
<![endif]-->

と書く方法もあるようです。

参照

/*
No hack, all versions
will apply these rules.
*/
#somewhere{
property:value;
}


/*
*7 hack
Only versions 5.5 and higher will
apply these rules, 5.0 will not.
*/
html*#somewhere{
property:value;
}


/*
Simplified box model hack
Only versions 6 and higher will apply
these rules, 5.0 and 5.5 will not.
*/
#somewhere{
property:value;
}


/*
Child selector
Only versions 7 and higher will apply
these rules, 5.0, 5.5 and 6 will not.
*/
html>body #somewhere{
property:value;
}

お問合せフォーム

お名前 :
Email: (必須)
メッセージ: (必須)


0 コメント :

コメントを投稿



連絡フォーム

名前

メール *

メッセージ *

サイト内検索