Like many developers I am using Twitter Boostrap for my Web applications. Using this framework has been very helpful for me, since I am really not a good HTML/CSS developer. For now, on my site Resultri I am using the default look and feel, will customize it later.
Lately, I wanted to integrate Google Map to my application, and when testing it, I had the bad surprise to see that the Controls and WindowInfo are not printed correctly as you can see in the screen shot below:
This is not a big issue at all, just a conflict on the img
tag and its style (max-width) coming from Twitter Bootstrap. The quick fix :
- override the style of the
img
tag for the div that contains your map.
For example in my case the div for my map is define as:
<div id="resultriMap" />
You just need to add a new style to your page with the following definition:
<style>
#resultriMap img {
max-width: none;
}
</style>
After adding this to my page the map is correctly printed as you can see in the following screenshot :