Comunidad de diseño web y desarrollo en internet online

problemas con IE (algo comúm)

Citar            
MensajeEscrito el 15 Mar 2009 06:46 pm
bueno tengo una tabla de tres filas, las que estan en los extremos (encabezado y pie de pagina) tienen un height fijo, la del medio (la que tiene el contenido) su height es de 100% para que se ajuste a la medida del navegador, en firefox funciona varbaro, pero en IE no, la tabla se hace mucho mas grande, su altura se transforma a la altura que tiene el navegador.. porque?

este es el codigo:

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=utf-8" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
html, body{
    height: 100%;
}
-->
</style></head>

<table width="800" height="100%" border="2" align="center">
   <tr>
       <td height="200px">asd</td>
    </tr>

    <tr>
       <td height="100%">asd</td>
    </tr>
    
    <tr>
       <td height="50px">asd</td>
    </tr>
</table>

<body>
</body>
</html>


si lo prueban, en firefox se ajusta a la resolucion pero en IE no se hace mucho mas grande

Byee Saludos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 02:34 pm
No deberias usar tablas para maquetar, solo para presentar informacion tabular; lo correcto es usar divs y css en archivos externos.

En cuanto a tu duda, debes usar cantidades proporcionales, y otra correccion en los atributos de height y width dentro de las celdas para los que son pixeles no se coloca la unidad 'px', solo el numero, las unidades se usan en las propiedades de las hojas de estilos. Solo la de porcentaje se especifica en ese tipo de atributos, que de hecho tampoco deberias usar ya que indican formato, y todas las reglas de formato deben ir en tu hoja de estilos. La transicion de tablas a divs no es facil para alguien que esta muy acostumbrado a las tablas, pero hay que hacerlo, sino vas a estar en desventaja con tus competidores.

En cuanto a tu problema, prueba este codigo (le puse colores solo para que se noten las divisiones), y te recomiendo otra invaluable buena practica, que uses un Reset CSS como la primera hoja de estilos que llames, porque esa te reseteara todos los valores de los distintos navegadores a 0, es decir bordes, margenes, rellenos, etc.

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=utf-8" /> 
<title>Documento sin t&iacute;tulo</title> 
<style type="text/css"> 

body {margin:0; padding:0} /*un pequeño reset para el body, pero usa el YUI Reset CSS, es mas completo*/
html, body{ 
    height: 100%; 
} 

</style>
</head> 
 
<table width="800" height="100%" border="0" align="center" cellpadding="0" cellspacing="0"> 
   <tr> 
       <td height="25%" style="background:#C9C">asd</td> 
    </tr> 
 
    <tr> 
       <td height="68%" style="background:#FCC">asd</td> 
    </tr> 
     
    <tr> 
       <td height="6%" style="background:#C9C">asd</td> 
    </tr> 
</table> 
 
<body> 
</body> 
</html>  


Esto mismo quedaria mucho mas preciso con divs, y si necesitas que tenga esos valores fijos y el medio que ocupe el resto, usarias un poco de javascript para hacer los calculos, JQuery es un framwork buenisimo de javascript y es amigo de los divs :)

Por drarock

Claber

705 de clabLevel

3 tutoriales

Genero:Femenino  

Lima, Peru

firefox
Citar            
MensajeEscrito el 16 Mar 2009 05:41 pm
es que probe hacerlo con divs pero se me re enquilombo :S, IE me mostraba una cosa Firefox otra, dreamweaver otra, y nescape seguro que otra XD asi que me calente y lo pase a tablas, no tengo tiempo en este momento de aprender ah hacerlo con divs porque es una pagina que tengo que vender, solo necesito darle porcentaje al del medio, mira te doy un ejemplo mira este citio http://www.estudioat.com.ar/estudio.html, si te fijas esta todo echo en tablas y usa porcentajes, le vi el codigo y no utiliza ningun js.. como hace??

byee Saludos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 05:43 pm

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 05:59 pm
Es que no esta usando ningun doctype, solo la etitqueta <html> sola, no es recomendable ya que el browser entra en Quirks Mode, tu estas usando XHTML Transitional lo cual funcionaria mejor si lo hicieras con divs y css, pero ya que estas haciendo esto de la manera antigua, mejor usa HTML 4.0 sin un identificador de sistema, o sea asi:

Código HTML :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>


Con eso ya puedes seguir trabajando con tu tabla que hiciste en un inicio.

Por drarock

Claber

705 de clabLevel

3 tutoriales

Genero:Femenino  

Lima, Peru

firefox
Citar            
MensajeEscrito el 16 Mar 2009 06:32 pm
mil gracias me salvaste.. porsupuesto se que las paginas de ahora tienen un mejor rendimiento en css + divs, el problema que no puedo estar en este momento probando haber si me sale ya lo intente pero me hacia un desastre los divs, asi que prefiero hacerlo con tablas y despues de esta web empezar a practiar hacinedo diferentes estructuras hasta que sepa bien como se utilizan, porque si lo hacia con posicionamiento absoluto no podia usar el porcentaje.. sabes donde hay un tuto de divs + css, el que esta aca en cristalab habla muy `poco

Byee Saludos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 06:36 pm
No tengo un tuto especifico que te enseñe a trabajar en divs, el de cristalab leelo de todas maneras, te da un overview de lo que tienes que saber y al final incluso un ejemplo de estructura, asi que de todas formas leelo y practicalo.

Luego, pues solo la practica hace al maestro, te recomiendo que veas galerias de css para que aprendas como son su estructura, y que veas el codigo fuente de las paginas para que aprendas y decifres como han sido realizadas y a la vez practicas, una galeria muy completa es CSSMania

Por drarock

Claber

705 de clabLevel

3 tutoriales

Genero:Femenino  

Lima, Peru

firefox
Citar            
MensajeEscrito el 16 Mar 2009 06:47 pm
perfecto muchas gracias :)

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 06:50 pm
te ago una pregunta mas, que tiene cristalab que cuando carga a otra pagina no se ve como van cargando los objetos de apoco, sino que parece que carga todo y despues te lo muestra de un pantallazo, yo la web que estoy haciendo la puedo ver de esa forma en IE, en moxila se ve muy fea la carga, porque?

Byee Saludos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 06:55 pm
mmm no entendi muy bien lo que dijiste, por ahi hay algo mal en el contexto, pero la web de cristalab esta en divs, cuando una web esta hecha en divs te permite ir viendo el texto primero mientras otros elementos cargan, asi puedes ir leyendo, las paginas que son en tablas se muestran hasta que todo el documento este cargado, puesto que cargan desde la celda mas anidada hacia afuera, y si es grande pues sera un tiempo mas largo de espera, y otro factor es el mismo browser que tiene su manera de ir cargando los elementos.

Por drarock

Claber

705 de clabLevel

3 tutoriales

Genero:Femenino  

Lima, Peru

firefox
Citar            
MensajeEscrito el 16 Mar 2009 07:03 pm
bueno si haber voy a explicarme mejor:

la web que estoy desarrollando, si la veo con IE, cada ves que voy pasando de plantilla, es como que primero carga el contenido, y luego te lo muestra (o es tan rapido que simula eso), pero con firefox cada ves que voy pasando de plantilla: el color de fondo aparece primero negro, despues pasa a blanco y despues pasa al color que le puese yo mas la imagen de fondo que no se repite, todo esto en menos de un segundo obio, y el contenido de adentro se va cargando de apoco, todo en el mismo lapso de segundo, mienras que otros citios no hacen eso, ejemplo en cristalb si pones actualizar ni te das cuenta que carga todo de vuelta, en mi pagina con moxila se produce todo lo que anteriormente te mencione porque?

Byee Saludos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox
Citar            
MensajeEscrito el 16 Mar 2009 07:31 pm
Como te digo un factor es que el browser tiene su manera de cargar los elementos, si estas en local se ve mas rapido, algo mas real veras cuando este publicado. Y si la haces con tablas tambien puede ser eso, o el peso de tu web en conjunto, etc.

Hay un plugin de firefox que se llama Web Developer, tiene una opcion Information->View document size y te muestra el peso de cada elemento. Y seguro le encontraras un mejor uso cuando aprendas a usar web standars.

Por drarock

Claber

705 de clabLevel

3 tutoriales

Genero:Femenino  

Lima, Peru

firefox
Citar            
MensajeEscrito el 16 Mar 2009 08:01 pm
ok voy a ver que peudo hacer, de ultima hacer un javascript te muestre la informcion de una cuando termine de cargar la pagina, vere que peudo hacer

Byee Saluidos!

Por wawi

325 de clabLevel

2 tutoriales

 

Argentina

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.