Responsive 3-column Grid Layout Leaves Open Spaces

I am building a responsive portfolio website with a grid of thumbnails. It goes from a one-column grid up to a three-column grid depending on the browser width. The problem occurs

Solution 1:

For as far as i know this could fix it

.thumbnailsdiv:nth-child(3n + 4){
   clear: left;
}

If one of the div's in a row does not have the same height as the others you need clear: left; on the first one of the next row.