Gallery images with bootstrap4 Flexbox

<!DOCTYPE html>
<html>
<head>
  <title>Gallery images with bootstrap4 Flexbox | par NGLESSON</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Mezgani said">
  <meta name="copyright" content="NGLESSON">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="container-fluid">
    <div class="d-flex flex-row flex-wrap justify-content-center">
        <div class="d-flex flex-column">
            <img src="https://images.unsplash.com/photo-1485963631004-f2f00b1d6606?auto=format&fit=crop&w=668&q=80" class="img-fluid">            
            <img src="https://images.unsplash.com/photo-1502865787650-3f8318917153?auto=format&fit=crop&w=334&q=80" class="img-fluid">
        </div>
        <div class="d-flex flex-column">
            <img src="https://images.unsplash.com/photo-1500816558239-6b91f4256ead?auto=format&fit=crop&w=331&q=80" class="img-fluid">
            <img src="https://images.unsplash.com/photo-1487376318617-f43c7b41e2e2?auto=format&fit=crop&w=750&q=80" class="img-fluid scale">
        </div>
        <div class="d-flex flex-column">
            <img src="https://images.unsplash.com/photo-1497888329096-51c27beff665?auto=format&fit=crop&w=751&q=80" class="img-fluid scale mb-2">
            <img src="https://images.unsplash.com/photo-1505253468034-514d2507d914?auto=format&fit=crop&w=334&q=80"  class="img-fluid">
        </div>
        <div class="d-flex flex-column">
            <img src="https://images.unsplash.com/photo-1502550900787-e956c314a221?auto=format&fit=crop&w=334&q=80" class="img-fluid m-1 p-1">
              <img src="https://images.unsplash.com/photo-1455853659719-4b521eebc76d?auto=format&fit=crop&w=750&q=80" class="img-fluid image m-1 p-1">
        </div>
    </div>
  </div>
</body>
</html>
.container {
  background: #f9f9f9;
}

.flex-column {
  max-width: 260px;
}

img {
  margin: 5px;
}

.scale {
  transform: scaleY(1.05);
  padding-top: 5px; 
}

                                    
toggle switch style02

toggle switch style02

texte animate css

texte animate css

Vidéo background en html5 style01

Vidéo background en html5 style01

Titre section avec une anmation style01

Titre section avec une anmation style01

Timeline style01

Timeline style01

Manual Slideshow

Manual Slideshow

Input range slider HTML style05

Input range slider HTML style05

Input range slider HTML style04

Input range slider HTML style04

Image hover 05

Image hover 05

Google Style Login

Google Style Login

Chercher un mot sur la liste

Chercher un mot sur la liste

Ajouter une pagination1

Ajouter une pagination1