Foros del Web » Creando para Internet » CSS »

[DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Estas en el tema de [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S en el foro de CSS en Foros del Web. EDIT: ME CONFUNDI EN EL TITULO, ES AL REVES, %NO y pixeles si. Bueno, como indica el titulo, estoy teniendo un problema al querer centrar ...
  #1 (permalink)  
Antiguo 24/03/2008, 22:37
 
Fecha de Ingreso: marzo-2008
Mensajes: 171
Antigüedad: 9 años, 9 meses
Puntos: 0
[DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

EDIT: ME CONFUNDI EN EL TITULO, ES AL REVES, %NO y pixeles si.

Bueno, como indica el titulo, estoy teniendo un problema al querer centrar una tabla, al medio de otra tabla al 100% de ancho y alto.

Si pongo por ejemplo, 600pix de alto, se centra dentro de ese rango, pero cuando le doy 100% de alto para que se adapte para cualquier caso, la tabla se me va al margen superior.

Tengo una tabla de 100% x 100% (ancho x alto) y adentro otro tabla (la q quiero centrada). Adentro de la de tabla principal tengo seteado CENTRO en "Horizontal" y MEDIO en "vertical".

No tengo idea que puede ser, me resulta muy extraño, porque en otras ocasiones me funcionó :S.

Si alguien puede ayudarme, le agradezco mucho.

Saludos!

Dejo un codigo de ejemplo por si sirve de ayuda:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
body {
	background-color: #000000;
}
-->
</style></head>

<body>
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center" valign="middle"><table width="300" height="300" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table>
</body>
</html> 
  #2 (permalink)  
Antiguo 25/03/2008, 10:07
Avatar de ElJavista
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: Lima Perú
Mensajes: 2.231
Antigüedad: 10 años, 9 meses
Puntos: 67
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

El height = "100%" en una tabla no siempre funciona, depende del DOCTYPE. Para que resulte solo elimina: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" incluendo las comillas.
  #3 (permalink)  
Antiguo 25/03/2008, 18:27
 
Fecha de Ingreso: marzo-2008
Mensajes: 171
Antigüedad: 9 años, 9 meses
Puntos: 0
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Gracias por la respuesta, igualmente, sigue sin funcionar :S que puede ser?
  #4 (permalink)  
Antiguo 25/03/2008, 19:16
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

De esta forma te funcionará siempre, te dejo el código tal como lo tienes pero no es necesario utilizar una tabla, con el contenedor sólo es suficiente:

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<style type="text/css">
<!--
body {
	background-color: #000000;
}
-->
</style></head>

<body>
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
  <tr>
    <td>
    <div style="position: absolute; margin-left: -150px; margin-top: -150px; width: 300px; height: 300px; top: 50%; left: 50%;">
    <table width="300" height="300" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table>
    </div>
      </td>
  </tr>
</table>
</body>
</html>
  #5 (permalink)  
Antiguo 25/03/2008, 21:46
 
Fecha de Ingreso: marzo-2008
Mensajes: 171
Antigüedad: 9 años, 9 meses
Puntos: 0
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Gracias ssclamp eso si funciona! Ahora mi duda, si quiero insertar dentro una tabla mas grande, se me deforma el div y queda por cualquier lado, como lo adapto? Gracias desde ya!

Mis saludos!
  #6 (permalink)  
Antiguo 25/03/2008, 22:01
Avatar de Apolo
Colaborador
 
Fecha de Ingreso: abril-2003
Ubicación: ubicado
Mensajes: 7.961
Antigüedad: 14 años, 8 meses
Puntos: 109
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Tema movido desde Web general hacia CSS.

Saludos,
__________________
Planes VPS en el mundo > DirectorioVPS
Visita los foros de hosting de ComunidadHosting
  #7 (permalink)  
Antiguo 25/03/2008, 22:24
 
Fecha de Ingreso: marzo-2008
Mensajes: 171
Antigüedad: 9 años, 9 meses
Puntos: 0
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Bueno, gracias, en realidad lo puse en el otro lado porque me parecio que era una consulta general, pero como digas.

Ahora, volviendo, cuando quiero poner un "contenido" mas grande, se me corre todo de lugar. Alguna sugerencia?
  #8 (permalink)  
Antiguo 25/03/2008, 23:28
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Re: [DUDA] CENTRADO ABSOLUTO - % si , Pixeles no :S

Tienes dos tablas, una envuelve todo el body y otra dentro del divisor que es el que sale centrado en ancho y altura (independientemente de la resolución de la pantalla).

Si quieres aumentar el tamaño de la tabla interior, debes también cambiar el tamaño del divisor que la contiene:

p.e.

Código HTML:
<div style="position: absolute; margin-left: -300px; margin-top: -200px; width: 600px; height: 400px; top: 50%; left: 50%;">
    <table width="600" height="400" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table>
    </div> 
En el ejemplo hemos aumentado el ancho al doble (de 300px a 600px) y la altura de 300px a 400px. Pero siempre deben ir acompasados los tamaños del divisor y de la tabla (contenedor y contenido).

Espero que te sirva.

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 20:35.