Posts Tagged ‘Thermonuclear Option’

Google Maps Does Not Print.

June 4, 2012


If your Google Maps does not print then perhaps your Print CSS is to blame. Mine, inherited from our esteemed clients, had this thermonuclear option embedded within it:

* {
position: static !important;
overflow: visible;

What you see there is the ‘asterisk’ selector applied at the top-level of the DOM which means it applies to every element on every page. Great, except that Google Maps rely on a combination of relative and absolute positioning, not static positioning and, most evil, the css had specified !important on the asterisk style, giving it a very high precedence.

To knock out the asterisk selector for Google Maps without disturbing the rest of my client’s Print CSS I had to declare a new selector for elements within Google Maps. This was:

#map_canvas * {
position: relative !important;

#map_canvas * > div {
position: absolute !important;

This seems to go OK.