Centrar mapa dentro de una celda.

LuisaJava · #1 (**permalink**) 07/11/2008, 05:29

Hola a todos.

He colocado un mapa de google maps dentro de una celda y lo que quiero es centrarlo dentro de la misma. He probado distintas soluciones que aparecen el foro, pero no hay forma.

Vean el código

Código PHP:

 
<table> 
<tr> 
    <td colspan="2" class="mapa" > 
        <?php HTML_CLIE::showGoogleMaps($myClie, $config); ?> 
                 
    </td> 
</tr> 
 
</table>

No puedo mostrarles la imagen del mapa porque no puedo subir archivos adjuntos (¿alguno de ustedes sabe cómo se activa la opción para poder subirlos?).

El caso es que el mapa, en lugar de quedarme centrado, me queda "pegado" a los lados derecho e inferior de la celda dejándome un margen de un centímetro aproximadamente en los márgenes izquierdo y superior.

Espero haberme explicado bien.

Saludos,
Luisa

Aresillo · #2 (**permalink**) 07/11/2008, 05:35

Te refieres a una imagen o a un mapa interactivo? supongo que lo segundo...
Un text-align no sería suficiente??

Expertos??

Aresillo!!

EDITO: Perdón, no me había fijado que no era una imagen... no vale con poner a la clase text-align?

LuisaJava · #3 (**permalink**) 07/11/2008, 08:09

Efectivamente, se trata de un mapa interactivo de Google Maps y no de una imagen.

Saludos,
Luisa

talmente · #4 (**permalink**) 09/11/2008, 11:46

prueba esto:

Código:

table {
	background: #000;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	display: inline;
	float: left;
	text-align: center;
}

Mikmoro · #5 (**permalink**) 09/11/2008, 12:00

Supongo que si das a la tabla un width del 100% no se centrará. De todas maneras, deberías poner algo más de código para saber al menos cómo es esa tabla, dónde está ubicada, etcétera.

talmente · #6 (**permalink**) 09/11/2008, 12:52

Cierto mikmaro, con esto es suficiente para un centrado horizontal sin más.

Código:

table {
	width: 50%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;

}

y cierto mikmoro es poca información la que da LuisaJava, por lo que igual, lo que pongo es poco o no le vale, pero una pista de por donde van los tiros si es.

Mikmoro · #7 (**permalink**) 09/11/2008, 13:04

Cita:

Iniciado por talmente

por lo que igual, lo que pongo es poco o no le vale, pero una pista de por donde van los tiros si es.

Cierto, así es, es una pista de por dónde van las cosas, aunque como no sabemos cómo tiene formado todo lo demás...

Ya veremos cuando aparezca

LuisaJava · #8 (**permalink**) 09/11/2008, 13:32

Hola de nuevo

Lamentablemente no les puedo adjuntar una imagen del mapa. Supongo que si la vieran sería todo más fácil. Bueno, lo que he hecho ha sido elimnar todo el código que estorba y he dejado sólo la parte en que aparece el mapa, que es la única que no consigo poner en su sitio.

Con este código me centra el mapa horizontalmente, pero no verticalemente. Además, si incluyo todo el código del formulario me aparece todo centrado, lo cual no es lo que quiero ya que se trata de la ficha de un cliente y cada campo ha de conservar su alineación.

Código PHP:

 
<html> 
<head> 
<table class="mapa"> 
</head> 
<body> 
 
<!-- MAPA ========================================================================================== -->  
<tr> 
    <td colspan="2"  > 
 
             <?php HTML_CLIE::showGoogleMaps($myClie, $config); ?>  
                 
    </td> 
</tr> 
 
</table> 
</body> 
 
</html>

Si sustituyo las líneas

<table class="mapa"> por <table>
<td colspan="2" > por <td colspan="2" class="mapa"> no me cambia nada.

Para el css he utilizado el código que ha proporcionado talmente

table {
width: 50%;
margin-right: auto;
margin-left: auto;
text-align: center;

}

cambiando table por mapa.

Ahora una preguntita para mikmoro ¿por qué si das a la tabla 100% no se centrará?

Gracias a todos,
LuisaJava

kseso? · #9 (**permalink**) 09/11/2008, 13:34

¿Y porqué no sigues las indicaciones de goole para incrustar el mapa en tu celda?
Haz el proceso a la inversa, si ya tienes definidos los valores del tamaño de la celda, da los mismos en las opciones de la página de google junto al resto de parámetros. Después con copiar y pegar el código que te ofrece maps.google en tu celda lo tendrás centrado.
Un saludo

talmente · #10 (**permalink**) 09/11/2008, 14:02

Ese codigo si lo tienes así en tu pagina esta mal, la tabla tienes que ponerla dentro del body y que hace la classe mapa???

Código HTML:

<head>

[B]<table class="mapa">[/B]

</head>
<body>

Mikmoro · #11 (**permalink**) 09/11/2008, 16:49

Cita:

Iniciado por LuisaJava

Ahora una preguntita para mikmoro ¿por qué si das a la tabla 100% no se centrará?

Pues porque ocupará todo el ancho, el 100%, y por tanto no podrá parecer nunca centrada, porque siempre lo ocupará todo. Para que algo se viera centrado debería dejar márgenes a los lados, ¿no?

Quizá hayas entendido mal y tú te quieras referiri a su contenido, que sí se podría centrar, pero no así la tabla. Simplemente ponle un borde y podrás verlo.

Y como te dice talmente, no puedes poner así tu código.

Cita:

Aparte de otros errores, así tu código no estaría dentro de una celda, ¿no?

LuisaJava · #12 (**permalink**) 10/11/2008, 16:59

Gracias a todos. Está claro que quien más mira, menos ve.

Saludos,
Luisa