Saludos
El motivo por el cual escribo se debe a una inquietud que me surgi� al
intentar implantar una especie de galer�a (solo por motivos de
pr�ctica, evitando as� un domingo ocioso). Bueno, el hecho es que se
presenta una lista desordenada de im�genes, cada item de dicha lista
presenta consigo una imagen....
XHTML
<div id="wrapper">
....
<div id="thumbs">
<h2>Imagenes de Muestra</h2>
<ul>
<li><a href="#"><img src="75x75.gif" alt="" /></a></li>
.....
</ul>
</div>
</div>
CSS
#thumbs li{
list-style: none;
display: inline;
margin: 10px 0 0 8px;
padding: 0;
}
Deseaba presentar dicha lista de im�genes de manera horizontal, evite
el uso de la propiedad 'float', asi que simplemente hice que los items
se visualizar�n como elementos en l�nea. La caja principal ('wrapper')
tiene una anchura de 603px, si presento 7 im�genes de 75px,
adicionalmente cada imagen presenta un borde de 1px, esto har�a de la
imagen en conjunto con su borde 77px, en total estar�a ocupando 539px
hasta ahora. Si a cada imagen le asigno un margen izquierdo de 8px,
estar�a ocupando 595px de los 603px de la caja contenedora, ahora
bien, los 8px restantes se le "asignar�an" al margen derecho de la
�ltima imagen. Pero resulta que lo que yo pensaba que era l�gico no
resulto as�. Tanto Firefox, Opera e IE me mostraban dicha lista m�s
grandes de lo que yo pensaba. Lo que note al principio es que los
navegadores si me respetaban el margen izquierdo de la primera imagen,
pero en las im�genes interiores se notaba m�s anchura de la
especificada, lo cual me llevo a pensar que algo pasaba con el margen
derecho (pero este estaba especificado en 0). La soluci�n que le
encontre a este problema fue la siguiente.
CSS
#thumbs li{
list-style: none;
display: inline;
margin: 10px -4px 0 8px;
padding: 0;
}
Ahora bien, el problema seg�n las muestras de los 3 navegadores
mencionados previamente quedo resuelto. Pero quede con la inquietud,
�por qu� sucede esto?, �por que hab�a m�s margen en las im�genes
interiores?.
Pueden encontrar la muestra del problema resuelto en:
http://sistemas.ing.ula.ve/~milton/practicas/gallery.html
Un saludo
--
# Milton Mazzarri
# Usuario de GNU/Linux: #369158
# Ubuntu Linux
# Weblog: http://milmazz.blogspot.com
_______________________________________________
Lista de distribuci�n Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente direcci�n:
http://ovillo.org/mailman/listinfo/ovillo
