Responsive thumbnail gallery

The Thumbnail gallery below is fully responsive without the need for media queries and uses a minimum of CSS. The gallery container has a CSS property of max-width:940px;. This allows the container to adapt to smaller mobile device screen sizes. The thumbnails will re-order themselves into 4, 3, 2 and 1 columns as allowed by available space. The thumbnails are aligned into the centre of available space by using the CSS property of text-align: center; applied to the gallery container. If the last row contains fewer thumbnails than other rows, then these will be aligned in the centre of the available space.

.gallery1 {
background-color: #CCC;
text-align: center;
.gallery1 img {
margin: 10px;