Problema con HTML

c0w · #1 (**permalink**) 06/03/2010, 15:12

Hice varias webs y tengo algo de experiencia... Pero me encontre con un problema simple, pero no lo puedo resolver.

Tengo el siguiente codigo y lo que quiero es que la tabla llegue hasta abajo de todo de la pagina es decir: height=%100 pero no me lo toma en ningun navegador. Ni firefox, ni IE.

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>CSDescargas - Counter-Strike</title>

<style type="text/css">
<!--
/* Body */
body {background-color:#4C4C4C; margin:0px}

/* Site */
.site_banner {height:60px; background-color:#DC9449; background-image:url(images/site_banner.gif); background-repeat:no-repeat}
.site_bg-left {width:21px; background-color:#333333; background-image:url(images/site_bg-left.png); background-repeat:repeat-y}
.site_bg-right {width:21px; background-color:#333333; background-image:url(images/site_bg-right.png); background-repeat:repeat-y}
-->
</style>
</head>

<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td>&nbsp;</td>
    <td class="site_bg-left">&nbsp;</td>
    <td width="758" align="center" valign="top">
	<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td class="site_banner">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table>
	</td>
    <td class="site_bg-right">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>

</html>

Si alguien me dice alguna mejor forma de hacerlo le agradeceria :)
Ya intente haciendo un fondo con repeat-y pero en IE se ve 1 px corrido hacia la derecha y me arruina el diseño.

Mahishasura · #2 (**permalink**) 06/03/2010, 17:12

Para que funcione el height:100%, debes hacer poner una capa principal, la que contendrá a un "contenedor", valga la redundancia.
Osea, algo así.

Código HTML:

Ver original<div id="gran_contenedor" style="width:100%;height:100%">
  <div id="contenedor" style="height:100%;"></div>
</div>

PD: Te recomiendo que reemplazes las tablas por capas div, y además vincules hojas de estilo (CSS) para que puedas tener el código más ordenado. Sólo sugerencia...
Para que comprendas, te podría resumir la diferencia así:
div=diseño
table=ordenamiento de datos

Saludos :D

c0w · #3 (**permalink**) 06/03/2010, 17:35

No me funciono :(, me podrias decir bien donde ubicar esos divs? si es posible me los reemplazarias en el codigo dado?

Si, los styles los puse ai para que vean como son. Pero los tengo en un css.

El problema es que no entiendo mucho de divs, y me manejo de 10 con tablas. Todos los diseños que hice en imagen, los pase a tablas sin problemas.

c0w · #4 (**permalink**) 07/03/2010, 15:32

Pasaron 24 horas y no encontre nada mas que esto:

Le puse 1 pixel a la izquierda de margin y se ve bien con IE y con Firefox pero por ahi eso trae problemas con los demas explorers.

Alguna ayuda?

Fernando_net · #5 (**permalink**) 08/03/2010, 04:04

Buenas.

Y si en vez de porcentajes pones los pixeles que quieres que te ocupe?

Saludos

tronkolmb · #6 (**permalink**) 08/03/2010, 07:59

yo creo que debe de ser porque tienes la tabla vacía.... si lo que quieres es crear una tabla vacía y que te coja las dimensiones de l pantalla entera, deberás, como dice Fernando ponérselo en pixels o ir celda por celda....

P.D.: Soy nuevo en el foro y ya de paso me presento jeje :D

c0w · #7 (**permalink**) 08/03/2010, 16:06

Gracias, pero si pongo en pixels hay gente qe tiene mas grande o mas chica la pantalla.. Debe haber otra forma.

O alguna forma de solucionarlo con css.. y haciendo el fondo esa tabla repeat-y y solucionar lo del IE qe se corre 1 pixel.

LO SOLUCIONE AGREGANDO 1 PX A LA DERECHA DE MARGIN, PERO NO SE COMO SE VE EN OTROS EXPLORERS.

Si qieren lo posteo aca, subo las imagenes a algun lado y me dicen como se ve.

Muchisimas gracias por la atencion.