JSFiddle - React, Tailwind, and code Playground

by Stéphane LEGRAND

HTML

<div id="temoignage"
    ><div class="vignette">
        <div class="text">
            <div class="imageVignette"><img src="img/temoignage/38/1.png?1437482660" /></div>
            test 3 images Témoignage Anonyme
        </div>
    </div>
     
    <div class="vignette">
        <div class="categorie">Foie</div>
        <div class="text">test2</div>
    </div>
     
    <div class="vignette">
        <div class="categorie">Diabète</div>
        <div class="text">
            <div class="imageVignette"><img src="img/temoignage/40/2.png?1437482660" /></div>
            test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM
            test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM
            test LOREP IPSUM
            test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM test LOREP IPSUM
        </div>
    </div>
</div>

CSS

#temoignage {
    background-color:red;
    padding:15px;
    padding-left:5px;
    overflow:hidden;
}
.vignette {
    width:350px;
    min-height:250px;
    height:auto;
    float:left;
    margin-left:10px;
    background-color:blue;
    margin-top:10px;
    padding:10px;
    overflow:hidden;
}
.vignette .categorie {
    background-color:tan;
    border:2px dashed chocolate;
    font-size:26px;
    margin-bottom:15px;
    text-align:center;
    font-family:Trebuchet MS;
    padding:10px;
}
.vignette .imageVignette {
    background-color:yellow;
    width:75px;
    height:auto;
    float:left;
    margin-right:15px;
    margin-bottom:10px;
     
}
.vignette .imageVignette img {
    width:100%;
}
.vignette .text {
    height:100%;
    overflow:auto;
}