vertical-align with Bootstrap 3

Question

I\'m using Twitter Bootstrap 3, and I have problems when I want to align vertically two div, for example — JSFiddle link:

Answer 1

Following the accepted answer, if you do not wish to customize the markup, for separation of concerns or simply because you use a CMS, the following solution works fine:

.valign {
  font-size: 0;
}

.valign > [class*="col"] {
  display: inline-block;
  float: none;
  font-size: 14px;
  font-size: 1rem;
  vertical-align: middle;
}

   

      
Big
   
   

       
Small
   
 

The limitation here is that you cannot inherit font size from the parent element because the row sets the font size to 0 in order to remove white space.