[Plugin: WP Flexible Map] wp flexible map – map remains black

G’day, if you can provide a link to your website, I can probably help you more.

In the meantime, it sounds like there might be a CSS problem, perhaps browser or browser version specific. Alternatively, there could be JavaScript error on the computers that the map is failing on. Can you look in the browser’s error console for those computers and see what is triggering the error? It might be this plugin, or it might be another plugin or your theme.

Information required to diagnose this problem includes:

• link to website where this problem can be seen
• operating systems the maps are failing on
• browsers / versions the maps are failing on

cheers,
Ross

link: https://www.fulltime-bohemians.ch/route
operating system: windows xp professional sp3
browser: internet explorer 8.0.6001.18702

if i switch to standard theme twentyeleven, the problem does not occure

thanks for your help

G’day, you have a line in your stylesheet for IE, stylesIE.css, that is doing this:

#main IMG { background-color: black; }

I don’t know why you’d do that, it’s way too general and is affecting the overlayed images in Google’s map. If you can’t make this rule more specific, then you can fix your problem by adding this rule to that stylesheet:

.flxmap-container img { background-color: inherit !important; }

cheers,
Ross

worked out great! thanks so much!

No worries, I’m glad it’s all working now ??

cheers,
Ross

Regarding the same website mentioned above: when clicking on one of the blue pins the text (location, etc) only appears in a light grey instead of black (so it is difficult to read). Think this is also a problem with the stylesheet. Have you got a solution to that as well?

Try this:

.flxmap-infowin { color: #000 !important; }

Or maybe this:

.flxmap-infowin, .flxmap-infowin a { color: #000 !important; }

cheers,
Ross

Unfortunately this did not work. Have you maybe an other rule to add to the stylesheet?

No, that first one should do it really. Maybe try this one though:

div.flxmap-infowin div { color: #000 !important; }

cheers,
Ross

argh this drives me mad. i tried now:

.flxmap-infowin { color: #000 !important; }
.flxmap-infowin, .flxmap-infowin a { color: #000 !important; }
div.flxmap-infowin div { color: #000 !important; }

but with no luck ?? i put the code to the same place where i already put .flxmap-container img { background-color: inherit !important; } (which works great)

have you any other ideas? ??

OK, but that was in the IE-only stylesheet, stylesIE.css, which won’t affect any of the other browsers. You need to move this new CSS into the stylesheet that all browsers will get.

It’s starting to sound like you need to get some CSS help for your website. Know any good website designers?

cheers,
Ross

Finally solved. my css-override function of the theme did not work properly. had to add rule manually to file. thx for your great support!

Excellent!