Responsive square images

Responsive 3x3 grid of square images. 3 Columns and 3 rows.

by nightcoregirl

HTML

<!-- 1st row */ -->
<div></div>
<div></div>
<div></div>
<!-- 2nd row */ -->
<div></div>
<div></div>
<div></div>
<!-- 3rd row */ -->
<div></div>
<div></div>
<div></div>

CSS

div {
    float:left;
    width: 30%;
    padding-bottom: 30%; /* = width for a 1:1 aspect ratio */
    margin:1.66%;
    background-color: #1E1E1E;
}