Foros del Web » Creando para Internet » CSS »

Necesito que IE se comporte como un adulto y al mismo tiempo acepte background repeat

Estas en el tema de Necesito que IE se comporte como un adulto y al mismo tiempo acepte background repeat en el foro de CSS en Foros del Web. Saludos a todos. Veréis, soy nuevo en el foro, he buscado en diversas secciones y no he conseguido dar con una solución, además llevo 3 ...
  #1 (permalink)  
Antiguo 17/11/2009, 01:41
 
Fecha de Ingreso: noviembre-2009
Mensajes: 29
Antigüedad: 8 años
Puntos: 1
Necesito que IE se comporte como un adulto y al mismo tiempo acepte background repeat

Saludos a todos. Veréis, soy nuevo en el foro, he buscado en diversas secciones y no he conseguido dar con una solución, además llevo 3 días Googleando sin resultado y ya estoy empezando a plantearme ingresar en un sanatorio mental. Mi problema es el siguiente. Tengo una web maquetada en CSS que parte de una estructura muy básica y que tiene el siguiente código (pongo el css mezclado con el html):

<head>

<!--<script type="text/javascript" src="Scripts/unitpngfix/unitpngfix.js"></script>-->
<!--<script type="text/javascript" src="Scripts/iepngfix_v2/iepngfix_tilebg.js"> </script>-->

<!--[if lt IE 7]>
<script src="Scripts/ie7/IE7.js" type="text/javascript"></script>
<![endif]-->

<style type="text/css">
<!--
/*#container-med { behavior: url('Scripts/iepngfix_v2/iepngfix.htc') }*/
body {
background-color: #FFFFFF;
text-align:center;
}
#wrapper {
text-align: left;
margin: auto;
width: 950px;
}
#container {
overflow: hidden;
width: 950px;
height: auto;
min-height: 862px;
position:relative;
}
#container-top, #container-med, #container-bot {
position:absolute;
}
#container-top {
width: 950px;
height: 391px;
top: 0;
background: url(images/top-trans.png) no-repeat;
}
#container-med {
width: 950px;
top: 391px;
bottom: 439px;
background: url(images/med-trans.png) repeat-y;
}
#container-bot {
width: 950px;
height:439px;
bottom: 0;
background: url(images/bot-trans.png) no-repeat;
}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="container">
<div id="container-top"></div>
<div id="container-med"></div>
<div id="container-bot"></div>
</div>
</div>
</body>
</html>

Veréis que la capa "container-med" la he definido a través de las propiedades top y bottom, ya que en función del contenido, esta capa variará de altura. Como ya adivinaréis, este código funciona correctamente en todos los navegadores... excepto en el IE (como no). A través de las librerías javascript IE7.js/IE8.js se consigue que el explorer "aprenda" entre otras cosas a reconocer capas definidas con las propiedades top y bottom, además los pngs de 24 bits se muestran correctamente en IE6. Lo que no admiten esas librerías es la opción background repeat. He probado a usar de forma conjunta otros scripts como "unitpngfix" o "iepngfix" que sí admiten el repeat pero parece ser que entran en conflicto y anulan la librería IE7.js perdiendo la opción de definir capas mediante top y bottom... ¿Alguien sabe cómo solucionar esto? He estado pensando y aunque no es lo que quiero, me conformaría con que en vez de repeat-y, la imagen tuviera el height al 100%, es decir, poner dentro del div: <img src="images/med-trans.png" width="950" height="100%" /> pero tampoco lo admite el Explorer, ¡ni siquiera la versión 7! ¡Socorroooo!

Última edición por SBeto; 17/11/2009 a las 01:48
  #2 (permalink)  
Antiguo 17/11/2009, 09:18
 
Fecha de Ingreso: marzo-2009
Ubicación: Uruguay
Mensajes: 128
Antigüedad: 8 años, 9 meses
Puntos: 8
Respuesta: Necesito que IE se comporte como un adulto y al mismo tiempo acepte backgr

Es complicado ese script, yo te recomiendo escribir esto en tu head, y quitar la libreria que has puesto.

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

Intenta poner eso y luego me cuentas.
  #3 (permalink)  
Antiguo 17/11/2009, 09:45
 
Fecha de Ingreso: noviembre-2009
Mensajes: 29
Antigüedad: 8 años
Puntos: 1
Respuesta: Necesito que IE se comporte como un adulto y al mismo tiempo acepte backgr

Muchas gracias por tu ayuda Kisquian. He eliminado los scripts y he puesto el condicional que sugieres. El caso es que funciona correctamente en IE7. Después he usado un emulador para probarlo en IE6 pero no funciona el background repeat-y. No sé hasta que punto será de fiar este emulador, he usado el IETester porque en el IE NETRenderer me da error al intentar renderizar con la versión IE6.
  #4 (permalink)  
Antiguo 17/11/2009, 09:45
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Necesito que IE se comporte como un adulto y al mismo tiempo acepte backgr

¿Y el doctype?
Cita:
Veréis que la capa "container-med" la he definido a través de las propiedades top y bottom, ya que en función del contenido, esta capa variará de altura
Incorrecto. Top | right | bottom | left | nada tienen que ver con el tamaño variable en función del contenido. Alteran la posición. Y para alterar la posición de un elemento hay que haberla declarado previamente como relative o absolute. Static no los admiten.

La mayoría de los fallos de ie6 están documentados y publicadas las soluciones, así que en la mayoría de páginas es innecesario utilizar esas librerías js para corregirlos. Y más cuando se utilizan en combinación de otros js.

Usa el "iepngfix" para solucionar el tema de los png transparentes y código estandar (el css y el html), coloca un doctype en tus páginas y algún tipo de reset en el css, y para los fallos de ie6 tienes mucha documentación en la red. Por ejemplo esta página.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 17/11/2009, 11:29
 
Fecha de Ingreso: noviembre-2009
Mensajes: 29
Antigüedad: 8 años
Puntos: 1
Respuesta: Necesito que IE se comporte como un adulto y al mismo tiempo acepte backgr

Hola kseso?. Tengo DOCTYPE en mi página, lo que pasa es que había omitido esas líneas porque el foro no me deja postear URLs. Es DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN". Lo de definir una capa de altura variable mediante TOP y BOTTOM, dí por supuesto que se podía hacer así porque me funcionaba en IE7, IE8, FF, Chrome y Opera. Además la capa tiene el position:absolute. De hecho creo haber leído no se dónde (he mirado en tantos sitios ya) que según los estándares CSS, una capa definida así debe responder de esa manera, que es la que a mi me interesa.
  #6 (permalink)  
Antiguo 17/11/2009, 11:34
 
Fecha de Ingreso: noviembre-2009
Mensajes: 29
Antigüedad: 8 años
Puntos: 1
Respuesta: Necesito que IE se comporte como un adulto y al mismo tiempo acepte backgr

Muy interesante la página que me has sugerido kseso?. Gracias, la estudiaré a fondo. Menuda lista de BUGs... para flipar, y seguro que ni están todos...
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 11:03.