Tengo el siguiente ejemplo: http://jsfiddle.net/Q5dXc/show/Twitter Miniaturas que responden Bootstrap: ¿cómo curar la sangría en la segunda fila?
¿Alguna idea de cómo puedo curar la sangría después de la 4ta miniatura?
Aquí está la fuente: http://jsfiddle.net/Q5dXc/
Mirando el documentation bajo el título '' más ejemplos, puedo ver su ejemplo de 2 filas, pero no puedo hacer que funcione.
¿Alguna idea? Gracias por adelantado.
Realmente no lo explican bien en la demostración, pero si usa el <div class="row-fluid"> alrededor de él, tiene que hacer otra fila para la siguiente línea de miniaturas. Si solo quiere hacer un montón de miniaturas que no son fluid, puede usar un <div> o <p>. Esto debería plantearse como un problema en contra de Bootstrap, por lo que se puede solucionar.
He encontrado el mismo problema y no he encontrado una solución elegante. Estoy usando este pequeño truco:
.thumbnails .span4:nth-child(3n+1),
.thumbnails .span4:first-child + li + li + li,
.thumbnails .span4:first-child + li + li + li + li + li + li {
margin-left: 0;
}
Tenga en cuenta que la larga serie de li son la forma de IE, y usted debe agregar uno de ellos para cada fila.
Este es un problema reportado en el Github Bootstrap oficial, entonces sugiero a cualquiera que busque más soluciones para verificarlo - twitter bootstrap on github.com.
A partir de este momento, el problema no se ha resuelto, pero varios usuarios han enviado más de 10 soluciones diferentes en el hilo de comentarios.
El documentation for thumbnails no alude al diseño responde, pero un predefinido row.span* con los niños:
...the thumbnails component uses existing grid system classes - like .span2 or .span3 - for control of thumbnail dimensions.
Tener chldren de .span2, .span3, .span4 o .span6 los siguientes patch trabajos con los navegadores modernos y Twitter Bootstrap 2.3.2:
.row-fluid .thumbnails .span2:nth-child(6n+1),
.row-fluid .thumbnails .span3:nth-child(4n+1),
.row-fluid .thumbnails .span4:nth-child(3n+1),
.row-fluid .thumbnails .span6:nth-child(2n+1) {
margin-left: 0;
}