Foros del Web » Creando para Internet » CSS »

Tablas de alto 100% en IE y FireFox

Estas en el tema de Tablas de alto 100% en IE y FireFox en el foro de CSS en Foros del Web. Probad este código un momento en IE y FireFox 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 ...
  #1 (permalink)  
Antiguo 24/05/2007, 11:36
Avatar de Phoncadiz  
Fecha de Ingreso: mayo-2004
Ubicación: Cádiz City
Mensajes: 232
Antigüedad: 13 años, 6 meses
Puntos: 1
Tablas de alto 100% en IE y FireFox

Probad este código un momento en IE y FireFox
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>Prueba</title>
<style type="text/css">
<!--
html, body {margin:0px;height:100%}
-->
</style>
</head>

<body>
<table width="1003" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" style="height:100%">
  <tr>
    <td width="772" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0" style="height:100%">
      <tr>
        <td height="25" bgcolor="#DFFFDF">Fila1</td>
      </tr>
      <tr>
        <td bgcolor="#E8FDFD">Fila2</td>
      </tr>
      <tr>
        <td bgcolor="#F9E0FC">Fila3</td>
      </tr>
      <tr>
        <td bgcolor="#F4F9D2">Fila4</td>
      </tr>
      <tr>
        <td bgcolor="#FDE2D7">Fila5</td>
      </tr>
    </table></td>
    <td width="231" valign="top">&nbsp;</td>
  </tr>
</table>
</body>
</html> 
¿Por qué en IE no se ve la tabla interior al 100% de alto y en FireFox si? ¿Qué otra forma algo más profesional debería de usar?

Gracias foreros.
__________________
Tantas horas delante de una pantalla servirá para algo....
[Phoncadiz; mínimo 8 h. al día con el PC] :stress:
  #2 (permalink)  
Antiguo 24/05/2007, 13:01
Avatar de fearlex  
Fecha de Ingreso: septiembre-2003
Ubicación: Exiliado de mi patria
Mensajes: 1.047
Antigüedad: 14 años, 2 meses
Puntos: 5
Re: Tablas de alto 100% en IE y FireFox

Necesitas ponerle otro estilo en el td, que contiene la segunda table, de lo contrario no crecera en IE, recuerda que todos los navegadores interpretan de diferente forma tanto el html como el css.

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>Prueba</title>
<style type="text/css">
<!--
html, body {margin:0px;height:100%}
-->
</style>
</head>

<body>
<table width="1003" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" style="height:100%">
  <tr>
    <td width="772" valign="top" style="height:100%"><table width="100%" border="0" cellspacing="0" cellpadding="0" style="height:100%">
      <tr>
        <td height="25" bgcolor="#DFFFDF">Fila1</td>
      </tr>
      <tr>
        <td bgcolor="#E8FDFD">Fila2</td>
      </tr>
      <tr>
        <td bgcolor="#F9E0FC">Fila3</td>
      </tr>
      <tr>
        <td bgcolor="#F4F9D2">Fila4</td>
      </tr>
      <tr>
        <td bgcolor="#FDE2D7">Fila5</td>
      </tr>
    </table></td>
    <td width="231" valign="top">&nbsp;</td>
  </tr>
</table>
</body>
</html> 
Espero haberte ayudado
__________________
Ya viene llegando, el comunismo en Cuba, ya se esta acabando.
www.fearlex.com | www.fearlexworld.com
  #3 (permalink)  
Antiguo 24/05/2007, 15:25
Avatar de Phoncadiz  
Fecha de Ingreso: mayo-2004
Ubicación: Cádiz City
Mensajes: 232
Antigüedad: 13 años, 6 meses
Puntos: 1
Re: Tablas de alto 100% en IE y FireFox

Por supuesto que me has ayudado, pero ahora me he encontrado con otro problema. Cuando pongo una de las filas (Fila 1) con una altura fija (25px) me vuelve a pasar lo mismo. Ni poniendo la altura en el TD se me soluciona. ¿Qué estoy haciendo mal?

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>Prueba</title>
<style type="text/css">
<!--
html, body {margin:0px;height:100%}
-->
</style>
</head>

<body>
<table width="1003" border="0" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" style="height:100%">
  <tr>
    <td width="772" valign="top" style="height:100%"><table width="100%" border="0" cellspacing="0" cellpadding="0" style="height:100%">
      <tr>
        <td bgcolor="#DFFFDF" style="height:25px" height="25">Fila1</td>
      </tr>
      <tr>
        <td bgcolor="#E8FDFD">Fila2</td>
      </tr>
      <tr>
        <td bgcolor="#F9E0FC">Fila3</td>
      </tr>
      <tr>
        <td bgcolor="#F4F9D2">Fila4</td>
      </tr>
      <tr>
        <td bgcolor="#FDE2D7">Fila5</td>
      </tr>
    </table></td>
    <td width="231" valign="top">&nbsp;</td>
  </tr>
</table>
</body>
</html> 
Muchas gracias por adelantado. Me es de mucha ayuda.
__________________
Tantas horas delante de una pantalla servirá para algo....
[Phoncadiz; mínimo 8 h. al día con el PC] :stress:
  #4 (permalink)  
Antiguo 24/05/2007, 20:23
Avatar de fearlex  
Fecha de Ingreso: septiembre-2003
Ubicación: Exiliado de mi patria
Mensajes: 1.047
Antigüedad: 14 años, 2 meses
Puntos: 5
Re: Tablas de alto 100% en IE y FireFox

Mejor pon lo que quieres hacer, y vamos a buscarle la solucion SIN tables, por que mi especialidad no son las tablas, todo ese lio creo que es un poco dificil de arreglar enfocado a crossbrowser, asi que te prometo que lo solucionamos con divs, o alguien mas que pueda ayudarte con las tablas.

Alguien se apunta con ayuda de las tablas ?? Por favor
__________________
Ya viene llegando, el comunismo en Cuba, ya se esta acabando.
www.fearlex.com | www.fearlexworld.com
  #5 (permalink)  
Antiguo 24/05/2007, 23:53
Avatar de Phoncadiz  
Fecha de Ingreso: mayo-2004
Ubicación: Cádiz City
Mensajes: 232
Antigüedad: 13 años, 6 meses
Puntos: 1
Re: Tablas de alto 100% en IE y FireFox

Ok, no me importa que sea con tables o con divs, el tema es que salga bien tanto en un navegador como en otro.
Me interesaría hacer una estructura tal que así:



La página está dividida en dos partes: cuadro verde (100% alto x 772px de ancho) y cuadro rojo ("lo que necesite" de alto x 231px de ancho). Dentro del apartado verde irán indeterminadas estructuras (las naranjas que ocupan el 100% del ancho verde) con la única excepción de que tanto arriba como abajo del cuadro verde irán las divisiones que he puesto en azul (100& de ancho del apartado verde y 25px de alto).
Por otra parte está la estructura roja que no tiene que ocupar el 100% del alto de la página y cuyo alto se determina según el contenido que tenga (bloques naranjas dentro del apartado rojo).

Creo que en la imagen se ve más o menos claro.
Gracias y perdón por el tocho
__________________
Tantas horas delante de una pantalla servirá para algo....
[Phoncadiz; mínimo 8 h. al día con el PC] :stress:
  #6 (permalink)  
Antiguo 25/05/2007, 03:18
hq1
 
Fecha de Ingreso: abril-2007
Ubicación: Madrid, España
Mensajes: 107
Antigüedad: 10 años, 7 meses
Puntos: 0
Re: Tablas de alto 100% en IE y FireFox

En lo que al alto se refiere, tanto con tablas como con divs, yo te diría que no especifiques nada a no ser que quieras un alto fijo (p.e.: 25px), o sea que no pongas 100%, que ya lo cogerá el navegador.

En el ancho depende. Pero como creo que no te he entendido del todo te voy a pedir algo:

Haz una imagen con la estructura y la pegas, así podremos entenderlo mejor.
  #7 (permalink)  
Antiguo 25/05/2007, 07:36
Avatar de Phoncadiz  
Fecha de Ingreso: mayo-2004
Ubicación: Cádiz City
Mensajes: 232
Antigüedad: 13 años, 6 meses
Puntos: 1
Re: Tablas de alto 100% en IE y FireFox

Vaya... en el post anterior había puesto la imagen pero parece ser que no. El esquema es el siguiente teniendo en cuenta el comentario del post anterior:

__________________
Tantas horas delante de una pantalla servirá para algo....
[Phoncadiz; mínimo 8 h. al día con el PC] :stress:
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:39.