*

IE対応に1日つぶれた(×_×)

公開日: Diary , ,

IE対応に1日つぶれた(×_×)

デザイナーなので、普段はMacintoshを使っています。
このブログのデザイン変更も当然Macで制作しました。

今日、休みだったから自宅のTV録画&エンコ用の自作PCで確認してみたら、エラい事になってました(・・;)

問題はIE6で発生しました。
トップやカテゴリのページは問題ないんだが、肝心の個別記事のページのレイアウトが崩れている(ToT)

IE6でご覧になってた方、ごめんなさい<(_ _)>

Winでの動作確認も当然するんですが、EeePCでは確認して問題なかったので、Winでも大丈夫だろうと思ってたんですが…
EeePCに入ってるブラウザは、IE7の他にFirefoxとGoogle Chromeのポータブル版。
あと、MacBookのFirefoxとSafariでも確認してたんですが、全て予定通りの表示をしてました。

もともと、IE6は独自ルール満載で要注意なブラウザ。
でも、まだまだIEのシェアの半分くらい占めているから見逃せないのも事実。

CSSは、それを想定してmarginの指定とか気をつけて作業したはずなのに…

とりあえず、全てのCSSを見直し。

表記の方法を直したり、Divを追加してスタイルを分けて指定してみたが、変化なし。

FirefoxならFireBugを使えば、ブラウザ上でスタイルを外したり、数値を変えたり…と便利なんだがIEでは使えないし(x_x;)

ソースを確認すると、コメントあたりまででソースが途切れているような状態。

コメントが怪しいから、MTの設定でコメント出来ないようにして再構築してみると、無事表示できた。
画像認証のCAPTCHAの設定で手間取ったから、そこかも?っと思って認証なしで設定してみても表示が崩れる。

で、色々調べたらブックマークレットで、FireBugの機能が使えるものを発見!

早速、使ってみたらコメントの送信ボタンあたりから、読み込みがちゃんと出来てなかったらしい。
もしかして、送信ボタンを画像にしたのが問題か?ってことで、試しに元々の送信ボタンに戻してみたら、無事に表示した。

しかし、他のブラウザは問題なく表示できてるし、画像ボタンの方が押しやすいし…

何か解決策が無いかと検索してみると、Formの画像ボタンには、一般的に3種類の方法があるみたい。

CSSでデザインしたかったのと、Valueが空なのがいまいち気に入らなかったので、buttomタグを使用していたんですが、これがだめだったみたい。

というか、もともとこのタグはIE6どころか7でもうまく動作しないらしい。

てなわけで、泣く泣くvalueを空にして、表示されてた元々のソースのままCSSで背景に画像を指定したら問題解決しました。

こんなことで1日使ってしまったよ(・・;)

頼むからIE6を使っているユーザはバージョン上げるか、他のブラウザ使ってください(^人^)

AD

関連記事

no image

TV壊れた(T▽T)

今日、いきなりTVがプツンと切れた。 エアコンとか使ってたからブレーカー?と思ったが、他は全く大丈夫

記事を読む

高虎さんのお墓に桜のじゅうたん

先週のことですが、アップするのを忘れてたんで、今頃アップ(・・;) 藤堂高虎のお墓のあ

記事を読む

センス No.4

昨日は初めての結婚記念日でした 横浜のハワイアンなお店を予約してたので、昼

記事を読む

Ver.G30th買っちゃいました♪

  機動戦士ガンダムの30周年を記念したガンプラ『RX-78-2 GUNDAM Ver.

記事を読む

no image

年末ジャンボ1億円当選!?

1週間も寝かせてあった年末ジャンボ宝くじ 当選番号確認してみたらなんと2等1億円と下1桁1番違い

記事を読む

AD

AD

TASCAMのiM2でiPhone4をボイスレコーダに

自分の所属している津民芸保存会で事務局をしている関係で、WEBの管

ワイパーをフラットタイプから新形状ワイパーに交換

フラットタイプのワイパーとは、湾曲したシンプルなデザインで、従来の

無料で使えるWi-Fiスポットが各地に広がっている

海外からの観光客の不満のダントツ1位が、「街なかに無料のWi-

もうすぐWiMAXの更新月なので、モバイル環境を見なおしてみた

前回の「Apple30周年記念なので自分のMac歴を思い返してみた

Apple30周年記念なので自分のMac歴を思い返してみた(モバイル編)

前々回のデスクトップ編、前回のノート編に続き、モバイル編。

→もっと見る

PAGE TOP ↑