Bootstrap 3 Column Alignment - twitter-bootstrap-3

Question

MY (COMMON) PROBLEM:
I am struggling with what I feel is an old or common problem with BootStrap 3 column alignment, but I am not sure how to articulate myself enough to find specific answers online via googling them, thus why I am posting this here.
Here is an example of my layout:
Depiction of Layout:
If you look at the first column, second row on the lower left you'll see a VERY long title, that now creates a bad alignment with the second column paragraph on the lower right and it looks unprofessional/unintentional.
WHAT I TRIED:
I've tried making a specific min-height to the h4 tags, but, of course the layout will make the layout change as the viewport changes.
I've tried specific CSS properties (like center-fix or flex???) and that only makes the element centered within the parent div, it STILL looks off and thus unprofessional.
MY CODE:
<style type="text/css">
.feature{
margin-bottom: 6%;
padding-left: 40px;
padding-right: 40px;
}
.bottom_icon_padding {
margin-bottom: 27px;
}
#other_features h4 {
text-align: center;
min-height:10%;
}
.field-item img {
padding: 0px;
}
</style>
<div class="col-md-offset-1 col-md-10">
<h4 style="color:#666;line-height: 2.3rem;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</h4>
<hr>
</div>
<div class="col-sm-12" id="other_features">
<div class="row">
<div class="col-md-offset-1 col-md-5 feature" ><img alt="Unmeeting Logo" src="/sites/default/files/unmeeting_logo.png" />
<h4 class="bottom_icon_padding" >Unmeeting RFAs</h4>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<p>Learn more</p>
</div>
<div class="col-md-5 feature" ><img alt="Synergy Logo" src="/sites/default/files/synergy_logo.png" />
<h4 class="bottom_icon_padding" >Synergy RFAs</h4>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
<p>Learn more</p>
</div>
</div>
<div class="row" >
<div class="col-md-offset-1 col-md-5 feature" ><img alt="Certificate Variant With Image" src="/sites/default/files/030-certificate-variant-with-image.png" />
<h4 class="bottom_icon_padding" >CTSA Program Collaborative Innovation Awards: Administrative Supplements</h4>
<p>These supplements allow investigators from two or more CTSA Program hubs to form collaborations to implement, assess, and/or disseminate discoveries in methods, approaches, education and training in clinical and translational science.</p>
<p>View site</p>
</div>
<div class="col-md-5 feature" ><img alt="Premium Badge" src="/sites/default/files/035-premium-badge.png" />
<h4 class="bottom_icon_padding" >SmartIRB</h4>
<p>SMART IRB is a platform designed to ease common challenges associated with initiating multisite research and to provide a roadmap for institutions to implement the NIH Single IRB Review policy.</p>
<p>View site</p>
</div>
</div>
</div>
MY QUESTION:
This is for a client that has ALOT of restrictions on layout so I can't just move anything around, can anyone make any suggestions so the bottom two paragraph sections align no matter what the viewport size is?

Answer 1

There could be one solution to set min-height:40px if you are sure of the content in your website.
Another solution could be that you modify your structure in a way that your Images come in one row and your describing text go to next row. Can post details if it suits you
.feature {
margin-bottom: 6%;
padding-left: 40px;
padding-right: 40px;
}
.bottom_icon_padding {
margin-bottom: 27px;
}
#other_features h4 {
text-align: center;
min-height: 40px;
}
}
.field-item img {
padding: 0px;
}
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
<div class="col-md-offset-1 col-md-10">
<h4 style="color:#666;line-height: 2.3rem;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It
has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem Ipsum.</h4>
<hr>
</div>
<div class="col-sm-12" id="other_features">
<div class="row">
<div class="col-md-offset-1 col-md-5 feature"><img alt="Unmeeting Logo" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSqrfVof7CYYRtsdCu1VD4AWoPB2gs25PP5hQAuhOwhZngrOhsS" />
<h4 class="bottom_icon_padding">Unmeeting RFAs</h4>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<p>Learn more</p>
</div>
<div class="col-md-5 feature"><img alt="Synergy Logo" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSqrfVof7CYYRtsdCu1VD4AWoPB2gs25PP5hQAuhOwhZngrOhsS" />
<h4 class="bottom_icon_padding">Synergy RFAs</h4>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
<p>Learn more</p>
</div>
</div>
<div class="row">
<div class="col-md-offset-1 col-md-5 feature"><img alt="Certificate Variant With Image" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSqrfVof7CYYRtsdCu1VD4AWoPB2gs25PP5hQAuhOwhZngrOhsS" />
<h4 class="bottom_icon_padding">CTSA Program Collaborative Innovation Awards: Administrative Supplements</h4>
<p>These supplements allow investigators from two or more CTSA Program hubs to form collaborations to implement, assess, and/or disseminate discoveries in methods, approaches, education and training in clinical and translational science.</p>
<p>View site</p>
</div>
<div class="col-md-5 feature"><img alt="Premium Badge" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSqrfVof7CYYRtsdCu1VD4AWoPB2gs25PP5hQAuhOwhZngrOhsS" />
<h4 class="bottom_icon_padding">SmartIRB</h4>
<p>SMART IRB is a platform designed to ease common challenges associated with initiating multisite research and to provide a roadmap for institutions to implement the NIH Single IRB Review policy.</p>
<p>View site</p>
</div>
</div>
</div>
</div>