新しいデザインのCSS レイアウト崩れ
今日、会社のパソコンでこのブログDig*Dagがどんな風に表示されるかチェックしてみました。
会社のブラウザはIE6。
世間で一番多く使われているブラウザ。
もちろんターゲットはIE6。
今回のCSSは自信があったッスが・・・
結果は・・・爆死っ!!
ヘッダー部分のレイアウトがぁ・・・崩れてるじゃないかぁ・・・
3カラムのレイアウトは崩れていないのでひと安心、と思いきや!
文字を大きくしていくと・・・
真ん中部分がストンと下に落ちている・・・
まずはヘッダー部分は少しwidthを変更し余裕を持たせて対処。
文字を大きくしていくと下に落ちてしまうのはどうすればいいかなぁ・・・
IE6で文字を拡大していくと崩れるレイアウト
まだ検索していないけど、どうすれば解決できるんだろう。
めんどうだからoverflow:hiddenを隠してしまうか?
それともfont-sizeの指定を%やemで指定すれば解決するのかなぁ?
そうは思わないけど・・・
IE6で背景のグラデーションが表示されない
pngが表示されないのはIE6のバグらしいのだが、ブロックの背景に指定しているのはjpg。
Firefoxではキレイに表示されている記事欄の影も、
記事タイトル部、右カラムの背景のグラデーションもIE6では表示されてない。
全くやっかいなIE6ッスねぇ。
IE6はjpgでもグラデーションの画像はブロックの背景に指定すると表示されないんでしょうか?
う〜ん・・・
とりあえず透過pngは下のJavaScriptを使ってみる。
まだまだオレにとっては難しいクロスブラウザレイアウト。
勉強がたりねぇなぁ・・・
Comments
What say you?
Track backs
http://digdagdig.blog117.fc2.com/tb.php/194-d0e60673
