Themeforestでテーマを購入したらYahoo!JavaScriptMapのコントロールがうまくいかなくなった件

最近サイトを作るときは、Themeforestという海外のテンプレート販売サイトにて、HTML+CSSのテンプレートを購入して、WordPress化している。もちろん、WordPressのテンプレートもあるのだが、こちらはかなり複雑なので、そのままカスタマイズしないでいじる分には問題ないが、あれこれしようとすると、はじめからHTML＋CSSのテンプレートを購入していじったほうが楽だ。

で、そういうふうにサイトをつくっていたのだけど、Yahoo!のJavaScriptマップをいれて、ズームやホーム表示などのコントロールを追加すると、なぜだかうまくいかないことに気づいた。

よく見ると、表示されていないわけではなく、すごく小さくなってかろうじて見えているようなレベル。

YOLP(地図):JavaScript版地図 – Yahoo!デベロッパーネットワーク

で、調べてみると、テーマで使用されているresponsive.cssの中に、

img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

というのがあり、これが悪さをしているのがわかった。

これを、Yahoo! JavaScriptMapで使われるクラスだけ、

/* YOLP 対応 */
div.yolp-noprint img {
	max-width: 160px;
}

としたら、とりあえず表示はされたので、しばらくこれで試してみようと思う。