Foros del Web » Creando para Internet » HTML »

Centrar tabla, horizontal y verticalmente en el browser.

Estas en el tema de Centrar tabla, horizontal y verticalmente en el browser. en el foro de HTML en Foros del Web. Hola de nuevo. Existe algún método o código para que una tabla esté centrada en la ventana del browser?? La página que estoy haciendo es ...
  #1 (permalink)  
Antiguo 06/03/2003, 16:29
Avatar de Clicker  
Fecha de Ingreso: febrero-2003
Mensajes: 51
Antigüedad: 14 años, 10 meses
Puntos: 0
Pregunta Centrar tabla, horizontal y verticalmente en el browser.

Hola de nuevo. Existe algún método o código para que una tabla esté centrada en la ventana del browser?? La página que estoy haciendo es una pequeña tabla, nada más, no hay frames, ni nada fuera de la tabla, pero deseo centrar esa tabla tanto horizontal como verticalmente, hasta ahora, solo he podidio hacerlo horizontalmente, pero no he podido centrarla verticalmente, de manera que cualquier persona que accese a la página siempre la vea al centro de la ventana de su browser.

Cómo hago???

Graciela.
  #2 (permalink)  
Antiguo 06/03/2003, 21:45
Avatar de emedos  
Fecha de Ingreso: diciembre-2001
Ubicación: Guadalajara Jalisco MEXICO
Mensajes: 378
Antigüedad: 16 años
Puntos: 0
mira

haces una tabla de una sola celda, le das al 100 % de ancho y de alto, a esa celda unica le das las propiedades de centrar su contenido tanto vertical como horizontalmente, dentro de esta celda pones tu tabla, o sea una tabla anidada en otra

ejemplo:
http://www.mwmex.com/tablas.htm
__________________
- El conocimiento es patrimonio de la humanidad, no es solo tuyo, transmítelo para beneficio de toda la humanidad.
  #3 (permalink)  
Antiguo 18/07/2003, 02:42
Avatar de Jokin  
Fecha de Ingreso: enero-2002
Mensajes: 725
Antigüedad: 15 años, 11 meses
Puntos: 1
Gracias emedos, sin querer también me has ayudado a mí
__________________
  #4 (permalink)  
Antiguo 09/06/2004, 15:40
 
Fecha de Ingreso: febrero-2003
Mensajes: 141
Antigüedad: 14 años, 9 meses
Puntos: 0
Esto no es compatible con XHTML , alguien conoce como hacerlo pero que sea compatible con XHTML?
  #5 (permalink)  
Antiguo 10/06/2004, 02:35
Avatar de umdraiga  
Fecha de Ingreso: diciembre-2001
Ubicación: Aragón España
Mensajes: 128
Antigüedad: 16 años
Puntos: 0
Gracias emedos
Yo también me he beneficiado de tu consejo
Gracias
__________________
http://www.umdraiga.com
Una causa justa :arriba:
  #6 (permalink)  
Antiguo 10/06/2004, 06:16
 
Fecha de Ingreso: febrero-2003
Mensajes: 141
Antigüedad: 14 años, 9 meses
Puntos: 0
Esto no es compatible con XHTML , alguien conoce como hacerlo pero que sea compatible con XHTML?
Ni siquiera con los esandar de HTML 4.01
Alguien sabe como lograr lo mismo pero que se valide como correcto en la W3C?
  #7 (permalink)  
Antiguo 29/08/2006, 12:44
Avatar de Jokin  
Fecha de Ingreso: enero-2002
Mensajes: 725
Antigüedad: 15 años, 11 meses
Puntos: 1
Mira que tiene tiempo este mensaje pero siempre vuelvo a él para recordar cómo se hacía.
Aunque ahora la pregunta de Shaka me parece importante...y como tampoco se cómo hacerlo, agradecería a quien nos dijiese cómo poder colocar una tabla en el centro de la pantalla, independientemente de la resolución o tamaño de la pantalla.

Es posible?

Gracias y un saludo
__________________
  #8 (permalink)  
Antiguo 03/10/2006, 19:42
 
Fecha de Ingreso: septiembre-2006
Mensajes: 10
Antigüedad: 11 años, 3 meses
Puntos: 0
Centrar vertical y horizontalmente

Hola, espero que el código que expongo a continuación os solucione el problema. Con este código pueden centrar en la ventana del navegador, imágenes, tablas y todo de lo que tengais ocurrencia.

Primero, identificamos el ancho y el alto de la ventana del navegador y la restamos del ancho de la tabla o del div o de lo que tengais para centrar, esto para hallar el centro del objeto horizontalmente.
Para calcular el centro del objeto verticalmente, pues se utiliza el alto (height).
Pero sin más palabras, el código lo colocamos en una etiqueta SCRIPT en la sección HEAD, así:

<CODE>
function CenterHV(){
TabCentral.style.setExpression('left','document.bo dy.clientWidth/2 - TabCentral.offsetWidth/2');
TabCentral.style.setExpression('top','document.bod y.clientHeight/2 - TabCentral.offsetHeight/2');
document.recalc(true);
}
</CODE>

de aquí, TabCentral es el nombre o el ID que le colocamos a la tabla en el cuerpo del documento HTML (o sea en la sección BODY) para identificarla. CenterHV es el nombre de la función con el cual vamos a centrar utilizando la carga de la página:

<CODE>
<BODY onLoad='CenterHV();'>
</CODE>

y en el cuerpo del documento (sección BODY), colocamos, la tabla, por ejemplo:

<CODE>
<TABLE ID='TabCentral' STYLE='position:absolute;top:0;left:0;' BORDER=4 CELLPADDING=4 CELLSPACING=4 BORDERCOLORDARK='BLACK' BORDERCOLORLIGHT='GRAY'>
<TR BGCOLOR='#6699CC' ALIGN='center'>
<TD STYLE='width:80;'><B STYLE='color:#FFFFFF;'>VERSIÓN</B></TD>
<TD STYLE='width:80;'><B STYLE='color:#FFFFFF;'>FECHA</B></TD>
<TD STYLE='width:400;'><B STYLE='color:#FFFFFF;'>DESCRIPCIÓN DE CAMBIOS</B></TD>
<TD><B STYLE='color:#FFFFFF;'>ELABORÓ</B></TD>
<TD><B STYLE='color:#FFFFFF;'>REVISÓ</B></TD>
</TR>
<TR BGCOLOR='#FAFFF4' ALIGN='center'>
<TD>-
</TD>
<TD>-
</TD>
<TD>-
</TD>
<TD>-
</TD>
<TD>-
</TD>
</TR>
</TABLE>
</CODE>

Un detalle importante para anotaros es que la posición del objeto debe ser como se especifica en el STYLE del objeto, o sea, position:absolute y top:0, left:0. Aunque podeis hacer algunos cambios y reutilizar la función para obtener otros resultados. Pero lo que quereis creo que es lo que corresponde a lo que expuse. Espero haberle sido de ayuda, y haber sido lo suficientemente explícito para solucionar el problema.
  #9 (permalink)  
Antiguo 04/10/2006, 00:55
Avatar de Jokin  
Fecha de Ingreso: enero-2002
Mensajes: 725
Antigüedad: 15 años, 11 meses
Puntos: 1
Saludos:

Gracias Colacho por responder. Miraré con detenimiento el código (no soy muy hábil) y haré las pruebas pertinentes. Cualquier duda la poste.

Mil gracias Colacho

Un saludo
__________________
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:19.