Re: Weird SPACE in placemark bubbles between images with Plug-in or Google Maps+KML

[Swoody]

And of course, none of these spaces show up in Google Earth proper.

[DougH]

I didn't get the space when I first looked at it with Internet
Explorer 8, but I did get it with Chrome, which along with your
observation about the Google Earth application seems to indicate that
its a browser thing. Unfortunately, since the conventional wisdom is
that Internet Explorer is a piece of garbage that displays things the
way you want them, instead of the way they are supposed to be, you
will probably need a really nasty hack to get rid of your problem, or
a slight redesign to hide it.

[Swoody]

Thanks Doug.

I tried it on both Mac and PC - and the SPACE shows up for me on ALL
these browsers (Safari, Firefox, Chrome, Internet Explorer)

Surely someone has experienced this???
I particularly don't understand why it does NOT occur when I use the
tour gadget. Maybe I should just create a super simple tour (like an
initial POV and just use that)

bah humbug

Sara

[DougH]

Sara -

Document Mode: IE7 Standards has no space, but IE8 Standards has it.
Apparently, its supposed to be there, but who knows how to get rid of
it. I spend a collossal amount of time with this sort of thing, and
usually end up avoiding the problem instead of fixing it.

What if you put the banner and the picture in a container with a black
background? If you can pull that off without trashing everything else,
the space would end up just making your banner a little taller.

As for setting things up in the Google Earth application and then
displaying it in the plugin, its not as bad as multiple browsers, but
almost.

Doug

[barryhunter (KML Guru)]

What's your actual HTML source look like?

We cant get that from a screenshot.

I've found can usually clear it up my making sure there is no
whitespace in the HTML - between block level elements (divs etc)

[Swoody]

Thanks Doug, I thought about that, but it would totally change the
look of it. :-)

Hi Barry, The info bubble itself is very simple:

<img src="http://www.fakeurlhere.com/logo.gif" width="500px"><br><img
src="http://www.fakeurlhere.com/Google-Plugin-pano/100520-
NorthRimLodge.jpg">
<p><h3><center><a href="http://www.fakeurlhere.com/Panorama/
NorthRimLodge/NorthRimLodge.swf" target="new">View the Panorama in 360
(Full-Screen)</a></center></h3></p>

Can you give me an example of how you would set up HTML like that
within an info bubble, or --probably as it has to be -- within the
KML?

MANY THANKS, as always,
sara

[barryhunter (KML Guru)]

I'm not certain, but maybe change it to be more valid html?

Something like

<p><img src="http://www.fakeurlhere.com/logo.gif" width="500"
alt="Logo"/><br/><img
src="http://www.fakeurlhere.com/Google-Plugin-pano/100520-
NorthRimLodge.jpg" width="500" alt="Pano Preview"/></p>
<h3 align="center"><a href="http://www.fakeurlhere.com/Panorama/
NorthRimLodge/NorthRimLodge.swf" target="_blank">View the Panorama in
360 (Full-Screen)</a></h3>

Using validating HTML should prevent browsers triggering quirks mode?

[Swoody]

Thanks Barry,

I shall try that!!!

You have no idea how much I APPRECIATE your help, as I am no code
gurl, just a photo gurl, trying to get along in a gps world

thank you.
Sara

[Swoody]

Aargh, didn't work.

Back to the drawing board.................

[Brendan Kenny]

Hi Sara,

That is a strange issue; there isn't even a whitespace node in there!

There may be a more obvious fix that I'm missing, but you can always
set the first image to be display:block and remove the line break.
Inline styles aren't the cleanest, but you do want the images to
function as block elements anyway, so in this case I think it's a
sufficient solution.

Cheers,
Brendan

[Swoody]

Hi Brendan,

THANKS!

Could you please give me an example of the type coding you mean - the
way that would be laid out?

Coding NEWBIE

many thanks!
Sara

[Brendan Kenny]

Hi Sara,

I've only tested this briefly, but this should give you a starting
point at least. Adapting from your earlier example:

<img src="http://www.fakeurlhere.com/logo.gif" width="500px"
style="display:block;"><img src="http://www.fakeurlhere.com/Google-
Plugin-pano/100520-NorthRimLodge.jpg"><h3 style="text-
align:center;"><a href="http://www.fakeurlhere.com/Panorama/
NorthRimLodge/NorthRimLodge.swf" target="new">View the Panorama in 360
(Full-Screen)</a></h3>

Cheers,
Brendan

[Swoody]

Hi Brendan,

Thank you! Your code sample did fix it in Google Map, but still not
in Google earrth Plug-in. aaaargh

THANKS for the suggestions!

Flummoxed,
Sara

[barryhunter (KML Guru)]

One last (and really ugly) suggestion: use tables!

<table cellspacing="0" cellpadding="0" border="0">
<tr><td><img src="http://www.fakeurlhere.com/logo.gif" width="500"
alt="Logo"/></td></tr>
<tr><td><img
src="http://www.fakeurlhere.com/Google-Plugin-pano/100520-
NorthRimLodge.jpg" width="500" alt="Pano Preview"/></td></tr>
<tr><td align="center"><h3><a href="http://www.fakeurlhere.com/
Panorama/
NorthRimLodge/NorthRimLodge.swf" target="_blank">View the Panorama in
360 (Full-Screen)</a></h3></td></tr>
</table>

[Swoody]

Le sigh,

Still no worky.

Thanks Barry and Brendan

:-P

sara

[fraser (Earth API Guru)]

Hi,

Figured I go in for a penny too..seems to work if you remove any
margin and padding from the elements.
Tested it in chrome, ie, and google maps and the space wasn't there.

Hope that helps,

F.

ps there is a working file here: https://sites.google.com/site/earthapi/test.kml
--
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.1">
<Placemark id="">
<name>test</name>
<description><![CDATA[<img src="http://
www.descentintothecanyon.com/Logo-Icon/Grand_Canyon-LOGO-550.gif"
width="500px"
style="display:block;padding:0;margin:0;"><img src="http://
www.descentintothecanyon.com/Google-Plugin-pano/100520-NorthRimLodge.jpg"><h3
style="text-
align:center;padding:0;margin:0;"><a href="http://
www.descentintothecanyon.com/Panorama/NorthRimLodge/NorthRimLodge.swf"
target="new">View the Panorama in 360
(Full-Screen)</a></h3>]]></description>
<Point>
<coordinates>0,50,0</coordinates>
</Point>
</Placemark>
</kml>

On Feb 17, 3:51 pm, Swoody wrote:
> Hello all,
>
> Can anyone please help me understand how to remove the odd white space
> which occurs between my logo and  images, when I load my KML into a
> Google Earth plug-in window? It also happens when I load my KML into
> Google Maps. Interestingly, if I use the Tour gadget, it does NOT
> occur, but I would like a plug-in window which is not a tour.
>
> Link to snapshot of Google Earth plug-in window:http://www.grandcanyonvirtualtour.com/bubble-space-question.png
>
> Google Earth map with KML loaded:
>
> http://maps.google.com/maps/mm?ie=UTF8&hl=en&ll=36.234028,-111.998749...
>
> Any help greatly appreciated,
> Best, Sara