Hacks para IE?

Ratus-BROWN · #1 (**permalink**) 25/03/2009, 17:38

Hola ,

he subido una web que he programado y en todos los navegadores se ve bien, pero en IE se me desmonta toda la maquetación ¿podria decirme alguien que hacks se utilizan para resolver estos problemas de visualizacion en IE? o alguna otra solución

Gracias.

DoPeY-BBS · #2 (**permalink**) 25/03/2009, 18:20

utiliza esta

ie7-js

ivor · #3 (**permalink**) 25/03/2009, 22:13

Puedes probar con un poquito de Javascript ;) Css Browser Selector es una de las soluciones más rápidas; el problema radica en que usa JS. y en caso de que el usuario desactive Javascript en su navegador **Ya se imaginan el resultado =S **

PD: Si tienes dudas de como usarlo preguntame por aqui :) te ayudo con mucho gusto

safe · #4 (**permalink**) 26/03/2009, 16:58

Para el 99% de los errores de visualizacion de IE no hace falta ningun hack CSS, ni javascript.
Si pones el codigo o una URL donde ver los problemas tal vez podamos ayudarte. Pero sin ver el codigo y sin saber exactamente de que problemas hablas es imposible.
Saludos, FS

Ratus-BROWN · #5 (**permalink**) 27/03/2009, 13:29

Hola,

entonces si el 99% de los problemas no se solucionan con CSS ni Javascript......¿ como se solucionan estos problemas sin hacks ?

os mando la URL : http://www.viviendascostablanca.com

el problema es que tengo el código CSS por otro lado, pero bueno..... a ver si me podeis orientar un poco.....

Gracias. R,Brown

gVenom · #6 (**permalink**) 27/03/2009, 14:13

Cita:

Iniciado por Ratus-BROWN

Hola,

entonces si el 99% de los problemas no se solucionan con CSS ni Javascript......¿ como se solucionan estos problemas sin hacks ?

os mando la URL : http://www.viviendascostablanca.com

el problema es que tengo el código CSS por otro lado, pero bueno..... a ver si me podeis orientar un poco.....

Gracias. R,Brown

SALUDOS

Bueno, yo uso mucho los hacks cuando IE me da lata. Uno de mis favoritos por facil es anteponer en el css una linea abajo para la linea de código _ . Te explico,Normalmente cuando nombramos una propiedad de un estilo, este es interpretado por todos los navegadores, pero si anteponemos # se aplica a todos las versiones de Internet Explorer, además si utilizamos _ el estilo se aplicará a Internet Explorer 6, luego tendríamos:

Código CSS:

Ver original.mydiv {
    height: 15px; /* Para todos los Browsers */
    #height: 20px; /*Para Internet Explorer */
    _height: 25px; /* Para Internet Explorer 6 */
}

Con lo cual obtenemos un mismo estilo interpretado de forma distinta de acuerdo al browser que tengamos.

Ahora, tambien puedes crear un css especifico para IE y otro para los navegadores de verdad. Solo detectas que versión usa el navegante y listo.

Este tipo de hack se sitúa entre las etiquetas <head> y </head>. Utilizándolo podremos detectar la versión del navegador y cargar el archivo CSS necesario.

Código HTML:

<head>
	<title>Título</title>
	<link href="all_browsers.css" rel="stylesheet" type="text/css">
	<!--[if IE]> <link href="ie_any_version.css" rel="stylesheet" type="text/css"> <![endif]-->
	<!--[if lt IE 7]> <link href="ie_6_and_below.css" rel="stylesheet" type="text/css"> <![endif]-->
	<!--[if !lt IE 7]><![IGNORE[--><![IGNORE[]]> <link href="recent_versions.css" rel="stylesheet" type="text/css"> <!--<![endif]-->
	<!--[if !IE]>--> <link href="not_ie.css" rel="stylesheet" type="text/css"> <!--<![endif]-->
</head>

los llamados comentarios condicionales. comienzan con <!-- y solo IE los va a entender, los demás navegadores los tomaran como comentarios y los ignorarán.

Espero que te sirva.

suerte.

Ratus-BROWN · #7 (**permalink**) 27/03/2009, 15:00

Hola gVenom,

voy a probar ahora mismo lo que me dices a ver si tengo algo de suerte, porque llevo dias con este tema......pero bueno, antes de empezar a hacer nada te queria preguntar una dudilla:

¿Las hojas de estilo que referencias aqui las tengo que crear yo, no? y en el caso de crearlas....¿que creo en ellas? es decir ¿debo poner una copia exacta pero cambiando las reglas con sus hacks correspondientes?...o que ¿debo hacer?

<head>
<title>Título</title>
<link href="all_browsers.css" rel="stylesheet" type="text/css">


<![IGNORE[]]> <link href="recent_versions.css" rel="stylesheet" type="text/css"> 
 <link href="not_ie.css" rel="stylesheet" type="text/css"> 
</head>

Gracias

gVenom · #8 (**permalink**) 27/03/2009, 15:10

si usas hojas de estilo diferentes no ocupas poner en ella ningun hack, excepto en la página donde cargas las hojas de estilo para detectar la versión. El chiste es que si en Firefox usas un padding-right: 35px; y se ve bien, pero en IE se ve pasadisimo, entonces en la hoja de estilo para IE en vez de el padding anterior le pones por ejm paddin-right: 15px; para que se vea bien. Generalmente el problema es la interpretacion del estilo,IE pone mas espacio o menos, asi que tienes que ir arreglandolo poco a poco. Las hojas de estilo las creas tu y le pones el nombre que creas mas apropiado, esta linea

Código HTML:

<link href="ie_any_version.css" rel="stylesheet" type="text/css">

lo que hace es cargar esas hojas de estilo, en este caso la hoja se llama "ie_any_version.css", pero tu la puedes llamar como gustes.

Ratus-BROWN · #9 (**permalink**) 27/03/2009, 16:36

ok, pues creo que me ha quedado bastante claro.

Para cada tipo de navegador crearé la misma hoja de estilos pero cambiando las reglas para que las acepte ese tipo de versión y son hojas normales (sin hacks). Luego la otra opcion es utilizar una hoja de estilos para todos a la vez donde ya voy poniendo los hacks de _ y # creo que hay tambien con *. Pero sin duda la mejor opcion es la de detectar los navegadores ¿No?, porque puede darse el caso que consigas arreglar por ejemplo con un _width o #width algun problema en IE7 pero te encuentras que en IE6 se sigue viendo mal........

Muchas gracias.

Saludos.