Disculpen estoy en contratiempo que quizas a alguno de ustedes ya lo habran solucionado.
De manera general quiero que en el IE 8 me reconozca mis mediaqueries y el css3...
Utilizo 2 Javascripts: Uno es el (prefixfree.min.js) para evitar escribir todo los prefijos de webkit, moz, ms, o y solo escribirlo directo sin todo eso. El CSS3pie para que sea compatible en el Internet Explorer los estilos HTML5.
También utilizo Bootstrap, Fonts de adobe
Pero tengo un problema
y se llaman los "iches
" mediaqueries... Tengo el siguiente codigo en el head:
Código:
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<!--MetaDatos Caracteres especiales-->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--MetaDatos Bootstrap-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes">
<!--CSS Icons Link-->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<!--CSS BootStrap Links-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<!-- Prefijos desactivados -->
<link type="text/css" rel="stylesheet" href="js\prefixfree.min.js">
<!--CSS Locales Links-->
<link type="text/css" rel="stylesheet" href="css\estilo.css">
<!--JavaScript Links-->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.js"></script>
<!--JS Fonts-->
<script src="//use.edgefonts.net/shadows-into-light-two.js"></script>
<!--MediaQueries en IE-->
</head>
<body>
Y en los CSS utilizo el CSSpie
Código:
.bandera{
width: 90px;
height: 90px;
position: relative;
zoom: 1;
border-radius:100%!important;
behavior: url(../js/PIE/PIE.htc);
}
Lo que tengo son imágenes que las convierto en círculos con border-radius
Ahora bien para utilizar los Mediaqueries ya probé dos: Respond.js (que el Bootstrap me recomienda para ser reconocido) y también el CSS3Mediaqueries.js del Google.
Con
CSS3Mediaqueries lo pongo debajo del
<!--MediaQueries en IE--> que tengo en el HTML:
Código:
<!--MediaQueries en IE-->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
Pero al ingresar a la pagina que se encuentra en el localhost me manda un mensaje de error que dice: "Esta pagina esta intentando el acceso a informacion fuera de su control. Esto presenta un riesgo de seguridad ¿Desea continuar?" pero me bloquea el proceso de IE.
Ahora probando el
Respond.js declarandolo como me dice el Bootstrap:
Código:
<!--MediaQueries en IE-->
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
Con esto si me empieza a reconocer los mediaqueries pero... me deja de reconocer mi HTML5 por ejemplo en la bandera, el border radius hace que mis imagenes regresen a ser cuadrados, apesar de que tenga el CSSpie.
Mi Internet Explorer es: 8 si las condiciones las hago [if It IE 8] no me reconoce las mediaqueries solo el CSS...
Alguien sabe o le ha pasado este problema antes?... Saben como solucionarlo?