Padding Bootstrap Thumbnails

Question

I am using thumbnails in bootstrap. I have been able to correct the padding to my liking on the sides, but not below it. This is a big problem on mobile as it's way too wide for my liking.

Code:

<div class="col-5-gutter">
<div class="col-md-4">
<div class="thumbnail"><img src="images/Thumbnail_Placeholder.png" alt="Thumbnail Image 1">
<div class="caption">
<h3>Text</h3>
<p>Text.</p>      
</div>
</div>
</div>
<div class="col-5-gutter">
<div class="col-md-4">
<div class="thumbnail"><img src="images/Thumbnail_Placeholder.png" alt="Thumbnail Image 1">
<div class="caption">
<h3>Text Here</h3>
<p>Text Here</p>
</div>
</div>
</div>
</div>

CSS:

.col-5-gutter > [class*='col-'] {
    padding-right:5px;
    padding-left:5px;
    padding-bottom: 5px;
}

Answer 1

The answer was marginsnotpadding. However the problem was in the thumbnail class:

.thumbnail {
margin-bottom: 5px;

}