Image Grid

[CRortyDG]

When you expand the grid of a 'Top' list, the grid displays one less column than the top row.

The carousel row continues falling off the page, and this is causing a duplicate first wrapped item.

The grid and the scroll able carousel are two different items of complete lists, currently the grid list is shifted to overlap its top row. This can be fixed by hiding the carousel when the grid is displayed and undoing the transform: translateY(-278px); and other css that forces the grid to overlap with the carousel.

when we remove the css we see the two full lists

Then hiding the carousel gives us our desired view -

[CRortyDG]

This also provides cleaner functionality (imo) when using the pagination as the row only shifts up, instead of both the carousel and row shifting.