Problema con li de imagenes horizontal

[matucasal]

Holag ente del foro.
Les cuento mi problema, estuve armando una galeria de fotos en javascript y me surgio un problema: al querer mostrar las imagenes en una lista horizontal, me las muestra o vertical, o en dos columnas
Aca les dejo el link:
http://pareddupla.com.ar/fotos.html

Ahora les cuento que esa galeria la tengo en un div.
Aca les dejo mis codigos a ver si entienden mejor:

Código HTML:

<div id="content">

<ul class="gallery">
<li><img src="images/fondocopado.jpg" title="" alt="Image01"></li>
<li><img src="images/azules.jpg" title="" alt="Image02"></li>
<li><img src="images/envivo1.jpg" title="" alt="Image03"></li>
<li><img src="images/letra.jpg" title="" alt="Image04"></li>
<li><img src="images/vivo2.jpg" title="" alt="Image05"></li>
</ul>
</div> 

Aca les dejo donde esta el id content

Código:

div#content {
	width:100%;
	background-color:#000000;
	height:100%;
}
div#content ul li {

float:right;
   	
}

Y por ultimo el gallery.css de la class gallery

Código:

.galleria{list-style:none;width:200px}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;/*float:left;*/ margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px}

La verdad es que no se q cambiar, yo puse como comentario el float ya que si lo saco queda afuera del div, y me arruina todo.
De ultima, si no hay forma de que la lista de imagenes quede horizontal, me gustaria que la foto al hacer click aparezca a la derecha, no arriba.
Gracias
Matias

[galizian]

Espero no equivocarme pero el problema lo debes tener en otra parte del codigo, he copiado lo que as puesto con las mismas imagenes y estas aparecen listadas en horizontal.
Como digo espero no equivocarme.

[kseso?]

Tienes en el html:

<div id="content">
<ul class="gallery">
...

y en el css:

.galleria{...

Deben ser iguales lo que está en negrita.

¿Supongo bien si supongo que lo que quieres mostrar en horizontal son las miniaturas de la galería?
SI es así, mira tu css:

.galleria li{display:block;width:80px;height:80px;overflow:hidden;/*float:left;*/ margin:0 10px 10px 0}

Borra el display:bock; y quita el comentario (/* */) a float: left.

Un saludo

[matucasal]

Gracias por la ayuda.
Lamentablemente cambie eso que me dijiste, y no obtuve resultados, me sigue apareciendo lo mismo. No se les ocurre otra cosa que pueda hacer?

[kseso?]

¿Y qué ancho tienen las miniaturas? Por que la caja que las contiene tiene una anchura de

.galleria{list-style:none;width:200px}

[Mikmoro]

Tienes un ancho que te sobra:

.galleria {list-style-image:none;
list-style-position:outside;
list-style-type:none;
width:200px;
}

porque eso no permite que se coloquen en horizontal.

¡Hay!

[kseso?]

Qué buena fotofinish
Ya era hora que por una vez ...
Después de dos años jejeje

[Mikmoro]

Esta vez ha sido hasta el mismo minuto. Dita sea...

[matucasal]

Era eso.
Agrande el width a 500 px y se ajusto mas como queria.
Muchas gracias

[kseso?]

o no le des anchura (o utiliza un max-width con su equivalente para ie si tienes un ancho máximo) y así no quedarán espacios en blanco o te saldrá una segunda fila.

<offtopic>debe ser por el lunes, Mik</offtopic>

[matucasal]

Che ya que estamos con css, queria ver otra cosa que me acabo de dar cuenta.
En firefox el index encaja perfecto, pero en ie se ven dos partes blancas a los costados del flash.
http://www.pareddupla.com.ar
Hay alguna forma de arreglar eso?
Les dejo los codigos.

Código HTML:

<div id="content">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="100%" height=300px scale="exactfit" fullscreen="true">
<param name="movie" value="Camino_Escena 1.swf" />
<param name="quality" value="high" />
<embed src="Camino_Escena 1.swf" width=600px height=300px quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" scale="exactfit"
fullscreen="true" ></embed>
</object>
</div> 

En el css , probe varias cosas sin exito

Código:

div#content {
        max-width:100%;
        max-height:100%;
	background-color:#000000;
	/*height:100%;
	width:100%;*/
        /*height: 300px
        width :600px*/

}

Estan comentados las cosas que probe sin resultado positivo
Jeje gracias de nuevo