Auto Grilla

Crea una grilla perfecta sin importarle la cantidad de elementos que contenga. Podemos setearle una cantidad de elementos por defecto y luego variar esta cantidad dependiendo de la resolución en la que se muestran.

  • 'grid-6' -- Ubica 6 elementos por línea
  • 'grid-md-4' -- Ubica 4 elementos por línea a partir de 992px
  • 'grid-sm-3' -- Ubica 3 elementos por línea a partir de 768px
  • 'grid-xs-2' -- Ubica 2 elementos por línea a partir de 480px
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
GRID-6 / GRID-MD-4 / GRID-SM-3 / GRID-XS-2
<div class="grid-6 grid-md-4 grid-sm-3 grid-xs-2">
<div>...</div>
...
</div>

Auto Grid Horizontal Scroll

Al igual que el Auto Grid crea una grilla perfecta sin importarle la cantidad de elementos que contenga con la diferencia que la cuadricula se transforma en un area escroleable a la resolución deseada utilizando la clase 'grid-(breakpoint)-horizontal'

GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
GRID-5 / Grid-md-horizontal
<div class="grid-5 grid-md-horizontal">
<div>...</div>
...
</div>
dosLotos Grid v.1.1.1
Autor Carlos 'Ruso' Cucurullo
doslotos ©