JSFiddle - React, Tailwind, and code Playground

HTML

<div class="images">
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/1000" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Een heel erg cute omg foto met een lange beschrijvingblablabla ablabla ablablfew ng hu</span>
    </div>
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/800" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Korte beschrijving</span>
    </div>
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/700" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Korte beschrijving</span>
    </div>
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/600" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Korte beschrijving</span>
    </div>
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/1200" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Korte beschrijving</span>
    </div>
    <div class="image">
        <div class="wrapper">
            <img src="https://placekitten.com/g/1000/1000" />
        </div>
        <span class="title">Naam van de foto</span>
        <span class="desc">Korte beschrijving</span>
    </div>

CSS

.images {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: row wrap;
}

.image {
    display: flex;
    flex-direction: column;
    height: 270px;
    padding: 10px;
    box-sizing: border-box;
    margin: 10px;
    border: 1px solid grey;
}

.wrapper {
    flex: 1;
    overflow: hidden;
}

img {
    max-height: 100%;
    max-width: 100%;
}

.title, .wrapper {
    display: block;
    text-align: center;
    text-wrap: normal;
    
}