<div class="container">
<h5>Css flexbox thumbnail arrangements</h5>  

  <ul class="imglist">
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3769909/chris-fernandez-the-mountain-4_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3706561/chris-fernandez-new-dad-8_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3734668/chris-fernandez-the-hound-4_1x.jpg" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3703338/chris-fernandez-spiderman-homecoming-2_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3477839/chris-fernandez-fancy-chewie-2_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3439615/chris-fernandez-screwball-3_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3432971/chris-fernandez-creamsicle-4_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3414457/chris-fernandez-baseball-playin-insta-2_1x.jpg" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3769909/chris-fernandez-the-mountain-4_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3706561/chris-fernandez-new-dad-8_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3734668/chris-fernandez-the-hound-4_1x.jpg" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3703338/chris-fernandez-spiderman-homecoming-2_1x.png" alt=""></li>

  </ul>
  <ul class="imglist center">
        <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3432971/chris-fernandez-creamsicle-4_1x.png" alt=""></li>
    <li><img src="https://cdn.dribbble.com/users/179241/screenshots/3414457/chris-fernandez-baseball-playin-insta-2_1x.jpg" alt=""></li>    
  </ul>
</div>


<p style="postion:absolute; bottom:0;font-size:8px;">picture courtsey : https://dribbble.com/c_illustrates</p>
.imglist {
  list-style-type: none;
  margin: 0;
  paddomg: 0;
  // display: flex;
  // flex-wrap: wrap;
  text-align: center;
  li {
    width: 50%;
    padding: 20px;
  display:inline-block;

    @media (min-width: 576px) {
    }

    @media (min-width: 768px) {
      width: 33.3%;
    }

    @media (min-width: 992px) {
      width: 25%;
    }

    @media (min-width: 1200px) {
    }
    img {
      max-width: 100%;
    }
  }
  &.center{
    justify-content:center;
  }
}

.container {
  h5{
    text-align: center;
  margin-top: 50px;
  }
}

body{
background: #f5f5f5;
height:100vh;
}
View Compiled
Run Pen

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.