I'm trying to limit the description balloon height in the following KML for use with Google Maps. In Google Earth, this is achieved by using the style element of a div wrapper, so the following KML works fine. However, when referenced via Google Maps, the height attribute is stripped out resulting in a large balloon when the maker is clicked.
<?xml version="1.0" encoding="utf-8"?> <kml xmlns="http://www.opengis.net/kml/2.2"> <Placemark>
<name>Test Mark</name>
<description>
<![CDATA[
<div style="height:150px;overflow:auto">
<table>
<tr><td>Row 1</td><td>some data</td></tr>
<tr><td>Row 2</td><td>some data</td></tr>
<tr><td>Row 3</td><td>some data</td></tr>
<tr><td>Row 4</td><td>some data</td></tr>
<tr><td>Row 5</td><td>some data</td></tr>
<tr><td>Row 6</td><td>some data</td></tr>
<tr><td>Row 7</td><td>some data</td></tr>
<tr><td>Row 8</td><td>some data</td></tr>
<tr><td>Row 9</td><td>some data</td></tr>
<tr><td>Row 10</td><td>some data</td></tr>
<tr><td>Row 11</td><td>some data</td></tr>
<tr><td>Row 12</td><td>some data</td></tr>
<tr><td>Row 13</td><td>some data</td></tr>
<tr><td>Row 14</td><td>some data</td></tr>
<tr><td>Row 15</td><td>some data</td></tr>
<tr><td>Row 16</td><td>some data</td></tr>
<tr><td>Row 17</td><td>some data</td></tr>
<tr><td>Row 18</td><td>some data</td></tr>
<tr><td>Row 19</td><td>some data</td></tr>
<tr><td>Row 20</td><td>some data</td></tr>
<tr><td>Row 21</td><td>some data</td></tr>
<tr><td>Row 22</td><td>some data</td></tr>
<tr><td>Row 23</td><td>some data</td></tr>
</table>
</div>
]]>
</description>
<Point>
<coordinates>1,23</coordinates>
</Point> </Placemark> </kml>
Here is how the KML looks in Google Maps
In my project, it is feasible that the tables I'm creating in the balloon description's could be quite long, so I need to make the balloon contents scrollable.
Just swap height for max-height like so:
<div style="max-height: 150px; overflow: auto">