Responsivní design - jak udělat obdélníky s textem uvnitř

Dobrý den,

už nějakou dobu se snažím vyřešit jeden problém... Nejsem moc zběhlí v CSS a bootstrap se teprve učím, tak mě asi nenapadl správný postup...
Na jednom řádku potřebuji mít čtyři stejně velké oddíly, které mezi sebou mají mezeru. Uvnitř těchto oddílů je různě dlouhý text. Text potřebuji mít pokaždé na středu elementu.

Šířka elementu by se měla přizpůsobovat rozlišení - pokaždé je celý řádek vyplněný. A výšku všech čtyř elementů potřebuji mít odvozenou od toho nejvyššího prvku (toho kde je nejvíc řádků textu). Ve chvíli, kdy zmenšuji rozlišení, se text v prvku začne přeskupovat (zvyšovat počet řádků) a když je nastavena výška, tak text přeteče přes okraj. Já bych chtěl mít stejnou, dynamicky nastavenou výšku u všech obdélníků podle toho, kolik je zrovna nejvíc řádků textu. Brr...
Na obrázku nahoře by měla být výška všech elementů nastavena podle druhého obdélníku (ve kterém je 8 řádků). Když bych zvětšil rozlišení, tak se text zformátuje jinak a bude mít třeba jen 6 řádků - takže všechny čtyři elementy budou vysoké čtyři řádky...

Existuje nějaké jednoduché řešení? Snad se to dalo pochopit...

HTML

<div class="row">
<div class="col-md-2 hidden-xs"></div>
<div class="col-md-10 hidden-xs">
    <span class="r_seven_cell">
        <div class="r_seven_text">
             text 1
        </div>
    </span>
    <span class="r_seven_cell">
        <div class="r_seven_text">
             text 2
        </div>
    </span>
    <span class="r_seven_cell">
        <div class="r_seven_text">
             text 3
        </div>
    </span>
    <span class="r_seven_cell">
        <div class="r_seven_text">
             text 4
        </div>
    </span>
</div>
<div class="col-md-2 hidden-xs"></div>
</div>

CSS

.r_seven_cell {
    
    float:left;
    position: relative;
    width: 18vw;
    height: 20vw;
    margin:1.66%;
    background-color: rgb(255, 255, 255);
    border: 1px solid grey;
    border-radius: 5px;
}

.r_seven_text {

    position:absolute;
    height:80%; /* = 100% - 2*10% padding */
    width:90%; /* = 100% - 2*5% padding */
    padding: 10% 5%;
    
    font-size: 18px;

}