Bing map in jQuery dialog not displaying correctly in IE8/9

Question

I have a jQuery dialog that pops up to display a bing map (birds eye view) on a real estate website I am building. For some reason, the birds eye view map works great in Firefox and Chrome and Safari, but not on either IE8 or IE9.

For an example, you can view this page:

http://test.nhfinehomes.com/Property/Detail/4126470

The birds eye view is the button right at the top. Been trying to figure this out for days now. When the dialog opens, the map is a small square section of the dialog, not the full dialog.

I have tried making the map a fixed width inside the dialog (just to see if that would work) but still no luck.

I think I need to fire some type of refresh when the dialog opens, but I can't seem to determine what that should be.

Link

Answer 1

In your div for the map make sure to specify the position property in your style. For example: <div id='mymap' style='position:relative;width:600px;height:400px;'></div>

Also consider using a pixel height and not a percentage as those don't always work.

---

http://rbrundritt.wordpress.com