Bug api google maps v3 sur FireFox

Bonjour,
je fais un site où chaque restaurant a sa petite carte google maps, j'ai en parti réussi, ça marche sur Safari, google chrome, mais sur FireFox, toutes mes petites cartes sont réunies en une seule, et ne s'affichent pas au bon endroit.

Quelqu'un aurait il une idée ? un problème de CSS ?
je génère du code javacsript avec une boucle en php

http://parisdiversity.free.fr/index.php5

le manuel de l'API est ici:
http://developers.google.com/maps/documentation/javascript/?hl=fr

Code qui permet d'afficher les cartes:

//Je prends tous les restos, du 75001 classé par nom
$rq = " SELECT id_resto, nom_resto, district, url_photo, adresse_resto, lat, lng
            FROM resto
            WHERE district='75001'
            ORDER BY nom_resto ";
$bundle_resultat = mysql_query($rq);
$html = '<table border="1">
		  <tr>
		    <td>NOM RESTO</td>
		    <td>photo RESTO</td>
				<td>adresse RESTO</td>
				<td style="width:400px;">plan RESTO</td>
		  </tr>';
						
$javascript= '<script type="text/javascript">' .'function initialize() {';	
//on boucle sur tous les restos		
while ($enregistrement = mysql_fetch_array($bundle_resultat) )
{
$map = 'map'. $enregistrement[id_resto];		
// on boucle sur le javascript
$javascript .=
'var latlng'. $enregistrement['id_resto'].  '= new google.maps.LatLng('.$enregistrement['lat'].','.$enregistrement['lng'].'); 
					var options'.$enregistrement['id_resto']. ' = {
					  zoom: 13,
					  center: latlng'. $enregistrement['id_resto'].',
					  mapTypeId: google.maps.MapTypeId.ROADMAP
					};
					 
var '.'map'. $enregistrement['id_resto'] .'= new google.maps.Map(document.getElementById("'. $map .'"), options'.$enregistrement['id_resto']. ');' .
					
					'var marker = new google.maps.Marker({'.
		       'position: latlng'.$enregistrement['id_resto'].','.
		       'map: map'.$enregistrement['id_resto'].','.
		       'title: "resto"'.
		       '});';
// fin boucle javascript	
// pour la foto
if($enregistrement[url_photo]=='') { $chainephoto = 'Pas de photo'; }
	else
	{
	$chainephoto ="<a href=\"javascript:NewWindow('upload-resto-grand/". $enregistrement[url_photo].".jpg ') \"><img src=\"upload-resto-mini/". $enregistrement[url_photo]. ".jpg \" /></a>";				
	}
	
// on boucle sur HTML
			$html .= 
			'<tr style="height: 220px;">' .
					'<td>'.  $enregistrement['nom_resto'] .      '</td>'.
					'<td>'.  $chainephoto . '<br />' .'</td>'.
					'<td>'.  $enregistrement['adresse_resto'] .      '</td>'.
					//'<td id="map">'. $carte .   '</td>'.
					'<td id="map'.$enregistrement['id_resto'].'">'.    '</td>'.
			'</tr>';
						
} // fin du while sur les restos

$javascript .= '} </script>';

echo $javascript ;  // on affiche le javascript

$html .= '</table>';  // on ferme le tableau
echo $html ;  // on affiche le tableau

?>

Modifié par stakanof (15 Jul 2012 - 00:11)

En utilisant les div et non pas un tableau pour présenter les données, ça fonctionne sur FireFox.