ie8 で画像の高さがおかしくなったときの一般的らしい解決方法

私の理解が正しければ、WordPress.com では、積極的にインターネット・エクスプローラのバージョン 8 への対応はとっていません。しかしながら、私が知る限り、日本国内では、まだ約 13% のシェアがあるようです(記事「WordPress.com で表示されるギャラリーが ie8 でもちゃんと表示されるようになっています」参照)ので、それなりに対応したほうがいい(丸くなるところが直角になる程度であればスルーするという考え方もあると思います。)場合もあります。

例えば、記事「instagram で撮った写真を WordPress.com に貼る」で紹介した instagram ウィジェットで表示される画像の場合、テーマ「Twenty Eleven 」の ie8 では、以下のように表示されます。

IETester

私の知る限り、このような現象は、海外のサイトでよく見られ、一方、日本国内のサイトではこのあたりがきっちりフォローされているような気がします。日本の方が保守的な感じがします。

ie8 で画像の縦方向が伸びてしまったりする現象は、一般的には以下のような感じの CSS を CSS スタイルシートエディターに追加すれば解決されることが多く、

/* instagram ウィジェットの画像の ie8 での補正 -テーマ「Twenty Eleven- */
.wpcom-instagram-images img,div[class^="wpcom-instagram-columns"] img {
	width: inherit!important;
	max-width: inherit important;
	height: auto!important;
}

instagram ウィジェットの場合も、この方法で解決できました。

IETester-1

参考

投稿者: comemo

mac & iPad で情報をインテグレートする

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。