Twitter BootstrapとGoogle Maps apiを同時に使用すると、
Twitter Bootstrap側のCSSの影響を受けて、
Google Mapsの表示内のアイコンが細長くなったり、
小さくなったり、
表示されないという問題が発生しました。
サイトを作成する上で、
ちょくちょくBootstrapの影響でおかしい所があったので、
まずBootstrap側を確認したところ、
やっぱり…という感じでした(；´∀｀)
Twitter Bootstrap側のCSSのimgに、
[php]max-width:100%;[/php]
と記述されていたのが問題です。
Google Mapsを表示するimgのidかclassに、
[php]max-width:none;[/php]とオーバーライドすると、
画像が正常に表示されるようになりますヽ(=´▽`=)ﾉ
コメント