twitter bootstrap - Google Map canvas is getting blank when printing (Ctrl + P) -

i'm trying print google map canvas inside bootstrap panel below:

<div class="panel panel-default">     <div class="panel-body">         <div id="map">...</div>     </div> </div> 

i'm trying print in simple way, pressing ctrl + p. @ print visualization box, map blank. happening?

some images:

at page

at print box

by selectively removing various lines @media print sections of bootstrap css i've discovered map comes when remove img {max-width...} line:

@media print { //...there's other stuff above here img { max-width: 100% !important; } //...there's other stuff below here }

you can override effects of (vs removing bs code) adding following somewhere below you've imported bootstrap:

@media print { img { max-width: none !important; } }

note i'm using sass in above code samples; i'm on rails project, i'm looking @ bs code via bootstrap-sass gem. equivalent less or vanilla css should easy achieve.

very still working on see if it's fix and/or if change has collateral damage... may want isolate div containing map or something.

edit: looks line comes code taken html5boilerplate project, included in bootstrap. i've created minimal demo page , opened issue on h5bp project.

update 21 jul 2016: fix slated inclusion bs 4.