Foros del Web » Creando para Internet » CSS »

Links de galeria no funciona en IE

Estas en el tema de Links de galeria no funciona en IE en el foro de CSS en Foros del Web. hola, sigo con el problema de la galeria de imágenes. Les paso el código a ver si alguien puede decirme que esta mal, porque en ...
  #1 (permalink)  
Antiguo 17/10/2007, 11:26
Avatar de chepi  
Fecha de Ingreso: abril-2005
Ubicación: Posadas - Misiones
Mensajes: 116
Antigüedad: 18 años, 11 meses
Puntos: 1
Links de galeria no funciona en IE

hola, sigo con el problema de la galeria de imágenes. Les paso el código a ver si alguien puede decirme que esta mal, porque en firefox funciona re bien, pero en Internet Explorer los links de la lista de imágenes no funcionan.

<style type="text/css">
/* Estilo Galeria en CSS */
/* Logo */
h2#galeria-logo {
margin: 0;
padding: 0;
position: absolute;
right: 25px;
top: 70px
}
h2#galeria-logo a:link, h2#galeria-logo a:visited {
border: 0;
width: 99px;
display: block;
height: 129px;
text-indent: -9999em;
background: url('css-gallery-logo.jpg')
}
h2#galeria-logo a:hover, h2#galeria-logo a:active {
background-position: 0 -128px
}
/* Informacion de la galeria */
div.galeria-descripcion {
position: absolute;
width: 300px;
top: 40px;
font-size: 1.3em;
left: 200px;
text-align: center;
z-index: 0;
color: #fff;
}
div.galeria-descripcion p {text-align: center}
div.galeria-descripcion h3 {font-weight: normal; font-size: 1.4em; text-decoration:none; color:#333333}
/* Contenedor y Lista */
div#contenedor-galeria {
background: #ffffff;
margin: 0 auto;
position: relative;
margin-top: 50px;
height: 300px;
overflow: hidden;
width: 650px
}
ul.galeria {
list-style: none;
padding: 20px 15px;
position: relative;
width: 495px;
font-family: 'trebuchet ms', tahoma, verdana, arial, serif;
margin: 0;

}
ul.galeria li {
width: 160px;
height: 22px;
padding: 1px 0;
line-height: 22px;
text-decoration:none;
color:#333333;
}
/* escondemos la informacion */
ul.galeria a span {display: block; text-decoration:none;
color:#333333;}
ul.galeria a:link strong.thumb, ul.galeria a:visited strong.thumb {display: none; text-decoration:none;}
ul.galeria li a:link, ul.galeria li a:visited {border: 0; text-decoration:none;}
/* Titulos */
ul.galeria a:link strong.titulo, ul.galeria a:visited strong.titulo {
color: #333333;
display: block;
height: 22px;
width: 160px;
background: #F3F3F3 url('Images/flecha.gif') no-repeat 2px 0;
text-indent: 27px;
font-weight: normal
}
ul.galeria a:hover strong.titulo, ul.galeria a:active strong.titulo {
background-position: 5px -22px;
background-color: #ffffff;
color: #CA0065;
text-decoration:none;
}

/* Thumbnail */
ul.galeria a:hover strong.thumb, ul.galeria a:active strong.thumb {
display: block;
width: 295px;
height: 250px;
visibility: visible;
position: absolute;
z-index: 5;
left: 175px;
top: 20px;
background: #F7F7F7;
text-align: right;
font-weight: normal;
padding: 15px 15px 5px 15px;
text-decoration:none;
}

/* Paginas */
div.galeria-pagina {
height: 350px;
width: 485px;
position: relative;
background-color: #ffffff;
}

/* Paginacion */
div#galeria-paginacion-container {
background: #ffffff;
width: 650px;
margin: 0 auto;
margin-bottom: 50px;
padding: 10px 0 0 0;
}
div#galeria-paginacion-container:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden
}
ul#galeria-paginacion {
margin: 0 auto;
padding: 0;
width: 120px;
margin-bottom: 25px;
padding: 0 0 15px 0;
list-style: none;
text-align: center
}
ul#galeria-paginacion li {display: inline; float: left; margin: 0 2px}
ul#galeria-paginacion a:link, ul#galeria-paginacion a:visited {
display: block;
float: left;
border: 0;
color: #555;
background: #333;
width: 25px;
height: 25px;
line-height: 25px;
text-decoration:none
}
ul#galeria-paginacion a:hover, ul#galeria-paginacion a:active, ul#galeria-paginacion a:focus {
background: #494949;
color: #fff
}




</style>
<!--[if IE]>
<style type="text/css">
/* Arreglando bug en IE */
ul.galeria li {height: 17px}
</style>
<![endif]-->
<!--[if IE 6]>
<style type="text/css">
/* Arreglando bug en IE */
ul.galeria li {height: 15px; margin-bottom: -4px}
</style>
<![endif]-->

////// ----------------- codigo HTML ----------------- ////////

<div id="contenedor-galeria">
<h2 id="galeria-logo"><a href="#">metal.ize - CSS Gallery</a></h2>
<div id="galeria-pagina1" class="galeria-pagina">
<div class="galeria-descripcion">
<h3>Souvenirs</h3>
</div>
<ul class="galeria">
<li><a href="#">
<strong class="thumb"><img src="Images/bolsitas.gif" alt="Bolsitas" /> <span>Bolsitas de recuerdos </span></strong>
<strong class="titulo">Bolsitas</strong></a></li>
<li><a href="#"><strong class="thumb"><img src="Images/cacharro.gif" alt="Cacharro" /> <span>Cacharritos con velas</span></strong>
<strong class="titulo">Cacharros</strong></a></li>
<li><a href="#"><strong class="thumb"><img src="Images/percha.jpg" alt="Perchitas" /> <span>Perchitas Percheras</span></strong>
<strong class="titulo">Percheros</strong></a></li>
</ul>
</div>

</div>
<div id="galeria-paginacion-container"></div>




desde ya, muuuuuuuchas 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 03:25.