Foros del Web » Creando para Internet » CSS »

Chrome lee bien. pero no IE 8

Estas en el tema de Chrome lee bien. pero no IE 8 en el foro de CSS en Foros del Web. Hola, mi nomre es Omar Gonzáles. Les escribo porque tengo un problema con el header en IE8, y quisiera que me ayuden si fuesen tan ...
  #1 (permalink)  
Antiguo 24/12/2010, 13:09
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Chrome lee bien. pero no IE 8

Hola, mi nomre es Omar Gonzáles. Les escribo porque tengo un problema con el header en IE8, y quisiera que me ayuden si fuesen tan amables.

Este es mi código HTML, le puse un código para que sólo lo lea IE6 (supongo que tmb sirve para IE8, o no?). Eso fue lo que encontré googleando... soy nuevo en esto, por favor cualquier ayuda se agradece.

Código:
<html>
<head>

<link rel="stylesheet" type="text/css" href="style.css"/>
<!--[if lte IE 6]>
      <link href="ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>

<div id="container">

<div id="header">

<div class="HorizLinks">
<ul>
<li><a href="somos.html">¿Quiénes somos?</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>

<div id="horizontalnav">

<div class="navlinks">

<ul>
<li><a href="somos.html">¿Quiénes somos?</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>






<div id="leftnav"> 

<div class="VertiLinks">

<ul>
<li><a href="somos.html">Quiénes Somos</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>

<div id="body"> This is the body </div>

<div id="footer"> This is the footer </div>

</div>

</body>
</html>

Este es mi código CSS (del archivo ie6.css, tengo otro que se llama style.css, me recomendaron crear dos para evitar deformaciones entre navegadores. El código es el mismo tanto en style.css como en ie6.css, no sé que debo cambiar para que se vea bien la css que sólo leerá IE gracias a la llamada que puse en mi html):






Código:
#container {

width: 100%;

}

#body {

font:  Verdana, Arial, Helvetica, sans-serif;
color: #000000;
background: #ffffff;
padding: 20px;

}

#header {

width: 100%;
height: 30%;
background-image: url(images/banner.jpg);
position: relative;
border-bottom: 20px solid #000000;

}

#header a {

color: ffffff;
text-decoration: none;
font-weight: bold;
font-family: verdana, helvetica, sans serif;
font-size: 16px;

}

#header a:visited {

color: 40c0ff;
text-decoration: underline;
font-weight: bold;

}

.HorizLinks {

position: absolute; top: 160px; left: 260px;

}

.HorizLinks ul {

margin: 0px; 


}

.HorizLinks li {

margin: 0px 15px 0px 0px;
list-style-type: none;
display: inline;

}


#horizontalnav {

width: 100%;
height: 40px;
position: relative;
background-color: #F2D6AF;
border-bottom: 2px solid #000000; 

}

.navlinks {

position: absolute; top: 4px; left; 240px;

}

.navlinks ul {

margin: auto;

}

.navlinks li {

margin: 0px 18px 0px 0px;
list-style-type: none;
display: inline;

}

.navlinks li a {

color: #000000;
padding: 5px 12px 7px;
text-decoration: none;
font-size: 16px;
font-family: arial;

}

.navlinks li a:hover {

color: #ffffff;
background-image: url(images/leftbotones.jpg);
text-decoration: underline;

}


#leftnav {

float: left;
width: 24%;
height: 96%;
background-color: c0c0c0;
position: relative;
border-right: 1px dashed #694717;

}

#leftnav a {

color: #ffffff;
font-family: arial;
text-decoration: none;
font-size: 16px;

}


.VertiLinks {

position:absolute; top: 20px; 

}

.VertiLinks ul {

margin: 0px;

}

.VertiLinks li {

margin: 55px 0px 0px 0px;
list-style-type: none;

}

.VertiLinks a {

padding: 20px 50px 20px 20px;

}

.VertiLinks li a:hover {

color: #ffffff;
background-image: url(images/black.jpg);
text-decoration: underline;

}






#rightnav {

float: right;
width: 140px;
height: 400px;
background-color: c0c0c0;
border-right: 1px dashed #694717;

}

#footer {

clear: both;
background-color: #D1C0A7;

}
  #2 (permalink)  
Antiguo 24/12/2010, 13:15
 
Fecha de Ingreso: julio-2008
Ubicación: Barcelona
Mensajes: 2.095
Antigüedad: 9 años, 4 meses
Puntos: 164
Respuesta: Chrome lee bien. pero no IE 8

Si lo subes mejor! ;)

un saludo!
  #3 (permalink)  
Antiguo 24/12/2010, 13:26
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Hola miktrv, ¿si lo subo mejor? Sólo es cuestión de abrir un block de notas y pegar el código, no?

gracias por contestar ;)
  #4 (permalink)  
Antiguo 24/12/2010, 13:28
 
Fecha de Ingreso: julio-2008
Ubicación: Barcelona
Mensajes: 2.095
Antigüedad: 9 años, 4 meses
Puntos: 164
Respuesta: Chrome lee bien. pero no IE 8

Cita:
Iniciado por OmarGon Ver Mensaje
Hola miktrv, ¿si lo subo mejor? Sólo es cuestión de abrir un block de notas y pegar el código, no?

gracias por contestar ;)
Sï! jeje

pero es un trabajo que tenemos que hacer todos cuando lo puedes hacer tu en una sola vez! más rápido y te ayudará mas gente.. es sólo una opinión!

Un saludo!
  #5 (permalink)  
Antiguo 24/12/2010, 13:37
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Miktrv, gracias por el consejo.

Les dejo el enlace a la página que estoy creando. La subí a un host gratuito para cuestiones de prueba.

ogon.webcindario.com
  #6 (permalink)  
Antiguo 24/12/2010, 13:48
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Chrome lee bien. pero no IE 8

pusiste el DOCTYPE??
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #7 (permalink)  
Antiguo 24/12/2010, 13:50
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Chrome lee bien. pero no IE 8

el html tiene que quedarte asi:

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>

<link rel="stylesheet" type="text/css" href="style.css"/>
<!--[if lte IE 6]>
      <link href="ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>

<div id="container">

<div id="header">

<div class="HorizLinks">
<ul>
<li><a href="somos.html">¿Quiénes somos?</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>

<div id="horizontalnav">

<div class="navlinks">

<ul>
<li><a href="somos.html">¿Quiénes somos?</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>






<div id="leftnav"> 

<div class="VertiLinks">

<ul>
<li><a href="somos.html">Quiénes Somos</a></li>
<li><a href="productos.html">Productos</a></li>
<li><a href="foros.html">Foros</a></li>
</ul>
</div>

</div>

<div id="body"> This is the body </div>

<div id="footer"> This is the footer </div>

</div>

</body>
</html>
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #8 (permalink)  
Antiguo 24/12/2010, 13:52
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Justo esa iba a ser mi siguiente pregunta. Estaba investigando sobre Doctypes, existen varios tipos, cuál me recimiendan? ¿cómo se utilizan, van al principio del documento html, encima de la etiqueta <html>?

Es necesario ponerla para que Ie8 reconozca la llamada a ie6.css? Está bien esa llamada o existe otra diferente para Ie8?

Está bien el código que escribí?

Gracias.
  #9 (permalink)  
Antiguo 24/12/2010, 13:55
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Gastón, con esa doctype todo se ha deformado en Chrome, lo mismo en IE8 y en Firefox :S :/

Tengo que modificar algunos valores en el CSS verdad? Pero cómo hago para que no se afecte el css que utiliza Chrome... creo que estoy haciendo algo mal al momento de llamar los css en index.html

:S
  #10 (permalink)  
Antiguo 24/12/2010, 14:02
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Chrome lee bien. pero no IE 8

hay 3 tipos de DOCTYPE

HTML 4.01 Strict ,

HTML 4.01 Transitional (el mas usado)

HTML 4.01 Frameset (este ya no se usa)


tendrias q validar tus archivos en la w3c y ahi te van a saltar los errores... siempre que empieces a maquetar hacelo en firefox y ya incluyendo el doctype, para que no te pase como ahora que decis q se te rompio todo el esquema que armaste... de todas formas no debe ser algo tan grave... fijate si cerraste bien las etiquetas y demas.... pero como te dije al principio anda a la siguiente pagina: http://validator.w3.org/ subi tu archivo y ahi te va a salir que errores tenes que corregir...

saludos!
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #11 (permalink)  
Antiguo 24/12/2010, 14:09
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Chrome lee bien. pero no IE 8

Hola:

Cita:
<!--[if lte IE 6]>
<link href="ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
Si lo pones así, le estás indicando que es, exclusivamente, para IE 6 por lo tanto el IE 8 lo va a ignorar.

Si quieres más información busca "comentarios condicionales".

Saludos.

  #12 (permalink)  
Antiguo 24/12/2010, 14:30
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Gastón gracias por darme a conocer el validador. Es una excelente herramienta. Bueno solo me queda desearles una feliz navidad y próspero año nuevo. Ya los volveré a molestar con mis preguntas después de fiestas.

Saludos ;)
  #13 (permalink)  
Antiguo 24/12/2010, 14:31
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Gracias Jomaruro ;)
  #14 (permalink)  
Antiguo 24/12/2010, 20:43
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Muchachos,

cuando le pongo:

Cita:
<!--[if lte IE]>
<link href="ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
( le borré el 6 de arriba para que todas las versiones de IE lo lean, es mejor así? Qué me aconsejan?)

Se deforma la página en Chrome, ¿alguien sabe por qué pasa eso?

Y en Internet Explorer (la 8 tengo yo) es visible el "<!--[if lte IE]> <![endif]--> " se ve al tope de la página. Y pues... aún sigo sin poder ver el banner que puse de imagen en IE.

Y si borro el DOCTYPE, todo regresa a la normalidad en Chrome. Pero IE sigue sin visualizar bien la página. :S

Ayuda por favor.

La web que uso de prueba:
ogon.webcindario.com
  #15 (permalink)  
Antiguo 25/12/2010, 04:02
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Chrome lee bien. pero no IE 8

Hola:

¿Y que significa el lte? Menor o igual que ¿no? Entonces, fíjate en lo que has puesto y razona si te puede funcionar eso.

Código:
<!--[if lte IE]>
Saludos.

  #16 (permalink)  
Antiguo 25/12/2010, 10:54
 
Fecha de Ingreso: diciembre-2010
Ubicación: Perú
Mensajes: 21
Antigüedad: 7 años
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

Sí, llegué a esa conclusión. Pero aún no entiendo porque al agregar el DOCTYPE se deforma en Chrome :S
  #17 (permalink)  
Antiguo 26/12/2010, 03:53
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Chrome lee bien. pero no IE 8

Hola:

El Doctype le indica al navegador como tiene que interpretar el HTML si lo has diseñado en Chrome sin Doctype lógico es que se vea bien, al ponerle el Doctype lo interpreta como le indica el doctype y no se ajusta a lo que tu quieres, no te queda otra que retocar lo que tienes hecho. No es un fallo del navegador, simplemente tu código no se adapta a los estándares.

Siempre debes indicar el Doctype.

Saludos.

  #18 (permalink)  
Antiguo 09/01/2011, 16:01
 
Fecha de Ingreso: enero-2011
Mensajes: 5
Antigüedad: 6 años, 11 meses
Puntos: 0
Respuesta: Chrome lee bien. pero no IE 8

para qué sirve .HorizLinks li { ?

Etiquetas: chrome
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 23:54.