vertical alignment within bootstrap column

Question

Trying to vertically center the text below. I've tried many of the solutions offered here but none have worked. Text always ends up at top of div. I have tried dozens of solutions.

<section id="services" class="services-section">
<div class="container">
<br />
<div class="row " style="background-color:#ffffff; margin:20px; padding:10px;">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 brown-background service-img"><img class="img-responsive" src="images/Siding.png" /></div>
  <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
  <h2>Siding Wash</h2><p>Some home maintenance tasks are just right for the do-it-yourselfer, power washing your siding is not one of those tasks. A simple miscalculation could cause significant damage to your siding requiring an expensive repair. Phantom Power Washing has the know how to gently remove grim from your home’s exterior and reveal it’s original beauty.</p>
  </div>
  </div>

.services-section {
height: 100%;
width: 100%;
background: #52402c;
text-align: center;
padding: 5px 5px 5px 5px;        
}

Answer 1

You could wrap the content you're trying to vertically centre in a div, and set its position to absolute and top padding to 50%. e.g.

<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12" >
                    <div class="sidingCopy">
                    <h2>Siding Wash</h2><p>Some home maintenance tasks are just right for the do-it-yourselfer, power washing your siding is not one of those tasks. A simple miscalculation could cause significant damage to your siding requiring an expensive repair. Phantom Power Washing has the know how to gently remove grim from your home’s exterior and reveal it’s original beauty.</p>
                    </div>
                </div>

CSS:

@media(min-width:768px) {
.sidingCopy { position: absolute; padding: 50% 0 0 0; }
}