Featured images are cropped on index and post page

Question

I am using a theme called Simple Bootstrap and after a recent update, the theme began cropping the height of the featured images on both the index and the post page. When I inspect the specific element for the image I get this (I'm including the div that encloses it):

<div class="featured-image">
  <a href="http://listen.undertheguntheater.com/index.php/podcast/s2-e4-down-will-come-or-nobody-can-catch-a-break-on-this-show/" title="S2 E4 &#8211; Down Will Come or Nobody Can Catch A Break On This Show">
    <img src="http://i0.wp.com/listen.undertheguntheater.com/wp-content/uploads/2015/06/Under-The-Gun-Presents-11.png?resize=1140%2C488" class="attachment-simple_boostrap_featured wp-post-image" alt="Under The Gun Presents (1)" />
  </a>
</div>

And I think the relevant CSS is:

.featured-image img {
  width: 100%;
  height: auto;
}

Is there something I can add to the theme's CSS that will correct this and show the full height of the image? I tried adding this to the CSS and while it did override it, it didn't fix the image:

.featured-image img {
  height: 100%;
}

You can view the page and inspect it here: http://listen.undertheguntheater.com/

Answer 1

This is likely a tweak the theme author made to make the images in the theme responsive or adaptive. You may want to look at adding "min-height" to your CSS and this should address your problem.

https://css-tricks.com/almanac/properties/m/min-height/

Also another thing to note if you using "100%" anything the actual dimension is governed by the parent element (whether is width or height).