Foros del Web » Creando para Internet » CSS »

centrar tabla segun resolucion

Estas en el tema de centrar tabla segun resolucion en el foro de CSS en Foros del Web. Buenas, tengo una pagina en la que el todo el contenido se encuentra dentro de una tabla. Para mas info, la web hace scroll ya ...
  #1 (permalink)  
Antiguo 02/12/2004, 05:07
 
Fecha de Ingreso: marzo-2004
Mensajes: 71
Antigüedad: 13 años, 8 meses
Puntos: 0
centrar tabla segun resolucion

Buenas, tengo una pagina en la que el todo el contenido se encuentra dentro de una tabla. Para mas info, la web hace scroll ya que en la tabla hay bastantes elementos, pero eso no me preocupa. Lo que deseo es centrar esta tabla (ya que no ocupa la anchura de pagina) segun la resolucion del equipo que este visualizando. Me gustaria hacerlo con CSS, ya que para la tabla tengo definida una clase, y solo tendria que modificarla.
Si alguien tiene idea sobre el tema, os agredeceria enormemente que me echaseis un cable¡¡

Un saludo y gracias por adelantado¡
  #2 (permalink)  
Antiguo 02/12/2004, 05:54
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Hola bbarranco

traslado el tema al foro de CSS

movido desde (x)html

saludos
  #3 (permalink)  
Antiguo 02/12/2004, 07:21
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola bbarranco

Prueba con esto:

<table style="width:400px;margin-left:auto;margin-right:auto">

Saludos,
  #4 (permalink)  
Antiguo 02/12/2004, 08:26
 
Fecha de Ingreso: marzo-2004
Mensajes: 71
Antigüedad: 13 años, 8 meses
Puntos: 0
NNop...

Hola buenas, gracias por la ayuda, pero sigue sin funcionarme. Tengo la clase Table definida como:
table {
width:700px;
margin-left:auto;
margin-right:auto;

}
Pero no me centra las tablas que tienen esa hoja de estilos adjunta. Me ha hecho un amago con el index, pero despues de borrar archivos temporales he actualizado, y otra vez pegado a la derecha...
Un poco raro no?
Bueno si sabes algo, aqui estamos, gracias¡¡
  #5 (permalink)  
Antiguo 02/12/2004, 10:38
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola de nuevo.

En IE no te funcionará si no le pones un DTD adecuado:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

También puedes meter la tabla dentro de una capa:

<div style="text-align:center">

Por cierto, creo que margin:auto falla en IE con XHTML estricto. Alguien sabe algo de esto y como solucionarlo

Bueno... Espero que esta vez te funcione. Saludos,
  #6 (permalink)  
Antiguo 02/12/2004, 14:20
Avatar de KnowDemon  
Fecha de Ingreso: julio-2004
Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 13 años, 4 meses
Puntos: 2
Hola JavierB,

Ignoro si margin: auto; funcione con XHTML estricto en IE, pero seguro funciona margin-left: auto; margin-right: auto; si lo que deseas es centrar algún elemento en bloque...
__________________
Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."
  #7 (permalink)  
Antiguo 03/12/2004, 10:33
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola KnowDemon

Tuve un despiste en mi anterior mensaje. Me refería precisamente a margin-left y margin-right. Por ejemplo, este código:

<div style="width:400px;height:200px;margin-left:auto;margin-right:auto;border:1px solid green">

En IE deja la capa centrata con un DTD transicional, pero no con estricto. Lo he probado con la versión 6.

Saludos,
  #8 (permalink)  
Antiguo 03/12/2004, 13:23
Avatar de Muzztein  
Fecha de Ingreso: agosto-2002
Ubicación: Hangar 18
Mensajes: 1.703
Antigüedad: 15 años, 3 meses
Puntos: 16
Cita:
Iniciado por KnowDemon
Hola JavierB,

Ignoro si margin: auto; funcione con XHTML estricto en IE, pero seguro funciona margin-left: auto; margin-right: auto; si lo que deseas es centrar algún elemento en bloque...
y por que no va a funcionar si el css no tiene nada que ver con xhtml ?
  #9 (permalink)  
Antiguo 03/12/2004, 19:36
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Con xhtml estricto en IE6 a mi me funciona perfectamente el centrado usando margin:auto.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Aqui va el titulo</title>
</head>
<body>
<table border="1" style="margin:auto;">
<tr><td>texto</td></tr>
</table>
</body>
</html>

El problema lo da IE 5.0, pero se soluciona definiendo text-align:center en el body
__________________
El conocimiento es libre: Movimiento por la Devolución
  #10 (permalink)  
Antiguo 04/12/2004, 03:54
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola.

El código de frijolerou me ha funcionado perfectamente. El problema era que no estaba poniendo bien el DTD.

Cita:
Iniciado por Muzztein
y por que no va a funcionar si el css no tiene nada que ver con xhtml ?
Pues puede que no tenga nada que ver una cosa con otra pero lo cierto es que si no pones ningún DTD en IE no funciona

Gracias a todos. Saludos,
  #11 (permalink)  
Antiguo 04/12/2004, 04:48
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola a todos:

Sobre el tema de poner margin: auto; o margin-left: auto; margin-right: auto;
Se trata de lo mismo, aunque con el primero de los casos también equivale a declarar margin-top: auto; margin-bottom: auto;

Esto se debe a que cuando nos referimos a estos estilos para bloques, la forma simple(margin, padding, border) equivale a la declaración para los cuatro lados... También se pueden poner 4 valores: margin: 1cm auto 20px auto; correspondiéndose a los 4 lados empezando por el superior y siguiendo el sentido de las agujas del reloj... o sea que equivaldría a:
margin-top: 1cm; margin-rigth: auto; margin-bottom: 20px; margin-left: auto;
Hay otras 2 formas de declarar este tipo de estilos, y se trata de poner solo 2 valores, cuando se pretende que sea igual la definición para cada pareja de laterales top/bottom left/right...

Y el último caso no lo tengo muy claro, ya que si se ponen 3 de los valores, no sé muy bien a como se interpreta... Si alguien lo sabe, me gustaría que lo indicase. (voy a buscar la respuesta, y luego lo comento)

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #12 (permalink)  
Antiguo 04/12/2004, 08:18
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola caricatos.

"Si hay tres valores el superior es definido por el primer valor, el izquierdo y el derecho son definidos por el segundo, y el inferior es definido por el tercero"

"Copypasteado" de: http://www.sidar.org/recur/desdi/mcs...caja.php#c_mar

En esta página se refiera concretamente a los márgenes, pero ya sabes que es lo mismo para padding, border y puede que alguna propiedad más.

Saludos,
  #13 (permalink)  
Antiguo 04/12/2004, 09:00
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola Javi:

Buena información ... Espero acordarme en el futuro

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #14 (permalink)  
Antiguo 10/02/2006, 13:11
Avatar de richardinj  
Fecha de Ingreso: enero-2005
Ubicación: Ciber Espacio
Mensajes: 2.180
Antigüedad: 12 años, 10 meses
Puntos: 11
A mi no me sale...

Puse una capa y nunca aparece en el centro de la pantalla, por mas que cambie la resulucion... siempre aparece en la esquina superior derecha.... porque?

<div id="datos" style="position:absolute; margin-left:auto; margin-right:auto; border:1px width:457px; height:138px; z-index:1"></div>
  #15 (permalink)  
Antiguo 10/02/2006, 13:19
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola richardinj

Quitale position:absolute y debería funcionarte. También falta un punto y coma después de border:1px pero supongo que será un error al poner el mensaje.

Saludos,
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 18:31.