Disable CSS Styles in Google Maps (3.14) Infowindow

Question

In google maps version 3.14 there are some new css rules added for the custom infowindow. I use the infobox plugin and now many of my elements styles are overwritten.

Fo

Answer 1

This is a breaking change in version 3.14, because the elements are now styled by CSS rather than inline.

The default fonts used in labels and UI elements has changed. UI elements are styled with CSS by the API, which means that custom CSS that targets DOM elements on the map may require some adjustments if you would like these to apply instead of the new default styling.

See changes in visual refresh for further details.

This is not a very good move by Google maps, because of the use of descendant selectors (on a div child!), which are not at all efficient.

To fix this you will need something quite specific like the following:

Given HTML

 

    
Lorem ipsum dolor
 

Try something like

.myClass-parent > div.myClass 
{
  font-weight:600;
}

Simply styling div.myClass may not work.