Equal text line length inside a bootstrap thumbnail.

Hi,

I have several thumbnail and I want to set the same text line width to all of them.

The basic thumnal structure loks like this:

<div id="prouctsThumbs" class="row">

        <article class="col-xs-4 col-sm-4 col-md-3">

          <div class="thumbnail"><a href="#" class="thumbnail"><img src="../../_images/products/thumbs/thumb1.jpg"  alt=""/></a>

            <p>text lenght 1</p>

          </div>

        </article>

        <article class="col-xs-4 col-sm-4 col-md-3">

          <div class="thumbnail"><a href="#" class="thumbnail"><img src="../../_images/products/thumbs/thumb2.jpg" alt=""/></a>

            <p>text length 2 which is longer</p>

          </div>

        </article>

If not, than in xs devices the text line, which is different for each thumbnail, may causes element missplacement as seen below.

I am trying to make an equal text line width.

I'd rather not use media queries for the <p> heigh becasue this differes for each size.

If i could make all text paragraphs equal and wrap inside its parent element that it would solve this.

Or any other way.

I do not use bootstrap 4.

Thank you,