Foros del Web » Creando para Internet » CSS »

Problemas con CSS junto a IE

Estas en el tema de Problemas con CSS junto a IE en el foro de CSS en Foros del Web. Hola buenas, Pues un porblema claro e importante esque no me muestran ninguna de las imagenes,son png y con transparencias,he leido un post y los ...
  #1 (permalink)  
Antiguo 08/10/2006, 16:21
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Problemas con CSS junto a IE

Hola buenas,

Pues un porblema claro e importante esque no me muestran ninguna de las imagenes,son png y con transparencias,he leido un post y los enlaces que proporcionaron los usuarios pero no me entero de nada,como lo hago en JS o CSS?alguien que sea tan amable de resumirme que ocurre?

Otro problemas es con la pseudoclase :hover en internet explorer no me funcionan,como lo arreglo?

Al fin y al cabo,vale la pena hacer dos versiones de web? o es mejor restringir el acceso a la web a usuarios que utilizen internet explorer como navegador?

Un Saludo y gracias de antemano!
  #2 (permalink)  
Antiguo 08/10/2006, 17:41
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
Para lo del png, lo que podes hacer es buscar alguna pagina que use png transparentes, y descargarla a tu disco rigido, analizás el codigo del html y buscas el archivo .js que utiliza ese sitio para permitir transparencias, y te lo copias para tu sitio.

lo del :hover, no se que puede pasa, a mi una vez me paso que con explorer ni siquiera me aparecia el cursor con la manito sobre los links, lo solucione ponieno position:absolute; pero no se si es tu caso, tendrias que publicar tu codigo para que podamos verlo

Y lo del las dos versiones, definitivamente NO, tenes que tratar de hacer una web accesible para todas las plataformas, navegadores y personas. Es bastante trabajo pero despues se te puede valorar un poco mas como profesional.
  #3 (permalink)  
Antiguo 08/10/2006, 19:25
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas de nuevo,

Bueno aqui os dejo el codigo,decir que es mi primer menu en css completamente desde cero,es decir,seguro que hay cosas que no las veis bien,en ese caso agradeceria las sugerencias de mejoras que pueden ser muchas.

Código:
#navegacion ul {
	position:absolute;
	left:0;
	top:260px;
	list-style:none;	
	margin-left:5px;
	margin-top: 20px;
	font-size: 12px;
	font-family:Verdana,Arial;
	font-weight:bold;
	padding: 0px 0px 0px 0px;
	width:146px;
	height:287px;
	
border:1px solid #a53323;
}

#navegacion ul li{
    background-image: url(ico.png);
	padding-left: 0px;
	padding-top: 7px;
	
	border-bottom:1px solid #a53323;
	border-top:8px solid #ff4f37;
	width:146px;
	height: 20px;
	text-align: center;
}
#navegacion ul li:hover{
    background-image: url(ico.png);
	margin-left:15px;
	padding-left:15px;
	padding-top: 7px;
	border:2px solid #fd5f21;
	border-top:8px double #fd5f21;
	width:146px;
	height: 20px;
	text-align: left;
	
}

a{
	color: #5c0803;
	text-decoration: none;
}
#navegacion ul li:hover a{
 color: #5c0803; #f59601 
	
}
#navegacion ul li:hover a:hover{
 color: #f59601 ; 
	
}
El problema esta en que en IE me visualiza el menu pero en estatico,cuando paso el raton por encima "no me hace el :hover".

Un Saludo y muchas gracias.
  #4 (permalink)  
Antiguo 08/10/2006, 20:31
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
subí el css completo y el html, porque hay que verlo funcionando todo completo, a mi me ha pasado que algunas propiedades de algunos objetos influyen a otros.
De todas formas creo que no esta bien estructurado, (SI ME EQUIVOCO POR ESTO QUE DIJE QUE ALGUIEN ME CORRIJA).

Yo suelo especificar un elemento ID para contener la lista. Por ejemplo #nav
Después creo una clase para esa lista en este caso podemos llamarlo ul.principal.
Aca te paso un menu que tengo hecho en una página, es muy simple, y quizas no te sirva para aplicarlo, pero fijate como esta estructurado.
Código:
#nav {
	padding-top:12px;
}

ul.principal {
	list-style-type: none;
	margin-top:20px;
}
ul.principal li {
	height: 25px;
	width: 176px;
	display: block;
	text-align: right;
}

ul.principal li a {
	font-size: 1em;
	color:#666666;
	text-decoration: none;
	background-color: inherit;
}

ul.principal li a:hover {
	text-decoration: underline;
}
Igual no es necesario que respetes todo como esta aqui, todo depende de lo que quieras
  #5 (permalink)  
Antiguo 08/10/2006, 20:46
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas,

Entonces que hago? restructuro todo el css? o no servira de nada en cuanto al problema de que no se ve como se deveria ver en IE?

Cita:
Igual no es necesario que respetes todo como esta aqui, todo depende de lo que quieras
Lo que quiero es que se vea jeje,me da igual como hacerlo si asi se me ve en IE y en Netscape,Mozilla etc..

Bueno,muchas gracias,Un Saludo!
  #6 (permalink)  
Antiguo 09/10/2006, 11:52
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
A ver lo del png deja ver, creo que en el mismo sitio de Microsoft hay un Js para la transparencia, deja ver si lo encuentro.

El :hover solo funciona en a.
  #7 (permalink)  
Antiguo 09/10/2006, 12:26
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
Uy no note eso que te dijo Rafael, es muy cierto.

Pero de paso te explico lo de la estructura, te recomiendo que hagas el menu de nuevo.
En el ejemplo que te di

#nav : es el contenedor del menu

ul.principal
: se refiere a las caracteríticas de la lista en si

ul principal li : afecta solo a los items, uno por uno

ul principal li a : son los items que funcionan como links

ul principal li a:hover : como ya debes saber son los links en estado de hover.


El html te tendria que quedar algo asi:

Código:
<div id="nav">
	<ul class="principal">
		<li><a href="index.html">Home</a></li>
		<li><a href="servicios.html">Servicios</a></li>
		<li><a href="contacto.html">Contacto</a></li>
	</ul> 
</div>
Cuando yo decia que "no es necesario que respetes todo como esta aqui" es porque la apariencia seguro es distinta a lo que vos queres, vos tenes que darle las propiedades que te sean necesarias.
En mi pagina personal por ejemplo tengo 3 listas de menu, y son muy distintas, y es mas.... tengo una que tiene problemas de visualizacion en :hover con explorer jajaja, pero despues algun dia le voy a dedicar mas tiempo.
El tema es que explorer te rompe la cabeza pero bueh... hay que hacer las webs accesibles para todos.

Última edición por marce_str; 09/10/2006 a las 12:32
  #8 (permalink)  
Antiguo 09/10/2006, 13:58
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Png transparente. Estaba en estos mismos foros :)
http://www.forosdelweb.com/showthrea...encia+imagenes
  #9 (permalink)  
Antiguo 09/10/2006, 14:42
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas,

Muchas gracias a los dos,haveis sido de gran ayuda,ahora probare todo aver que tal,y lo del png..he probado unas cuantas cosas y no me funcionaban,a ver si esta solucion es exitosa.

Un Saludo y gracias de nuevo.
  #10 (permalink)  
Antiguo 09/10/2006, 14:59
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola de nuevo,

Despues de probarlo no me funciona jaja la verda es que no me extraño..bueno,por curiosidad he probado una imagen .jpg,es decir sin trasparencia,y tampoco me funciona,no aparece ninguna imagen,yo estoy que no entiendo nada,haver si sabeis ahora por que no me deja ver imagenes...

Otra cosa,esto que dijo Rafael:
Cita:
El :hover solo funciona en a.
En firefox por lo menos si me deja aplicarlo a otros elementos,te referias que solo funciona en a en IE??

Un Saludo
  #11 (permalink)  
Antiguo 09/10/2006, 15:28
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Si, en Ie solo funciona en a.

El script PNG funciona bien, trata un poco más. Está bueno.
  #12 (permalink)  
Antiguo 09/10/2006, 16:19
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas,

El problema ahora rafael no son las transparentes,el problema es que no me muestra la imagen de fondo con background-image en IE,con la etiqueta <img> si,mira asi lo tengo:

Código:
#cabecera>#c1{
position:absolute;
left:1px;
top:7px;
background-position:0px 0px;
width:356px;
height:69px;
background-image: url(nube.jpg);
background-repeat: no-repeat;
Hay algun fallo para IE que evite que sea vean las imagenes de fondo??

Un Saludo y gracias!
  #13 (permalink)  
Antiguo 09/10/2006, 19:37
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
mm... la verdad que no se que te pasa ahora... pero... por que le pusiste background-position: 0px 0px; ?? saca eso y trata de ubicarlo sin left ni top, prueba con margenes a ver que pasa.
De todas formas, volve a probar el script de js, yo uso ese o uno muy similar, no se y funciona bien
  #14 (permalink)  
Antiguo 09/10/2006, 19:58
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas,

Lo de background-position lo pongo para que me salga la imagen justo en la esquina superior izquierda del elemento <div>,marce lo de el script de js no me sirve de nada de momento,porque primero quiero averiguar que pasa que no se me ven las imagenes sea cual sea su extension.
He probado lo que me has dicho y sigue sin aparecer las imagenes..

Bueno un Saludo y gracias por la ayuda que me estais dando,se agradece.
  #15 (permalink)  
Antiguo 09/10/2006, 21:07
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
probá con poner background-position= top left;
  #16 (permalink)  
Antiguo 10/10/2006, 15:13
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Buenas,

Sigue sin funcionarme,estoy deseperado ya,que puedo probar mas??

Un Saludo y muchas gracias!
  #17 (permalink)  
Antiguo 10/10/2006, 17:44
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
sera que pone #cabecera>#c1 ?
probaste con poner algo mas simple? no puedo opinar mucho porque nunca use ">"

o te pasa con TODAS las imagenes? Porque la verdad que no se que puede ser que no te muestre ni siquiera un jpg.
tenes la web en linea para mostrarla?
  #18 (permalink)  
Antiguo 11/10/2006, 16:01
Avatar de limboings  
Fecha de Ingreso: enero-2005
Mensajes: 794
Antigüedad: 12 años, 10 meses
Puntos: 2
Hola buenas,

Si,era el indicador de hijo,pero como en mozilla me funciona bien pues no pensaba que fuese eso..
Ahora solo queda la transparencia de las imagenes,que ya lo probare mañana que no me da tiempo ahora..ya os contare.

Un Saludo y muchas gracias!
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 09:18.