<div class="container">
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
<div class="item">
<img src="http://www.planwallpaper.com/static/images/kitty-cat.jpg" />
</div>
</div>
body {
background-color: #2d2d2d;
}
.container {
width: 1024px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
background-color: #ffffff;
padding: 1em;
margin: 1em auto;
&:after {
content: "";
flex: auto;
}
.item {
height: 10em;
width: 25%;
padding: 0.5em;
box-sizing: border-box;
img {
width: 100%;
}
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.