Bootstrap box-sizing: border-box Issue

While applying the Twitter Bootstrap to one of my existing web applications, I ran into a slight problem with a univeral CSS setting being applied by the bootstrap.min.css file that was resulting in a few controls appearing, for lack of a better word, "squashed".

The universal setting in the boostrap.min.css file that was causing the issue is presented as follows:

*, *:before, *:after {

     box-sizing: border box;

}

Two resolve the issue, I simply updated the CSS element associated with the controls that were being "squashed" as follows:

#mcc-search-bar * {

  box-sizing: content-box;

}

Once in place, the controls that were leveraging the mcc-search-bar class now appeared as expected.