Responsive container height
<p>I set up the slideshow on this site to be responsive but now I need the container height to adjust with the image inside.</p>

<p><a href="http://www.yourwhiteknight.com/test/" rel="nofollow">http://www.yourwhiteknight.com/test/</a></p>

<p>HTML:</p>

<pre><code>&lt;div id="feature"&gt;
    &lt;div class="topshadow clearfix" style="position: relative; width: 1113px; height: 335px;"&gt;
        &lt;div class="feat_box first" style="display: none; position: absolute; top: 0px; left: 0px; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://www.yourwhiteknight.com/wp-content/uploads/2014/08/Company-Photo_MF-RE-Page-Slide-Show.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://www.yourwhiteknight.com/wp-content/uploads/2015/11/New-Home-Page-Photo-copy-2.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/10/iStock_000016899532Medium.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/10/iStock_000018818618Medium.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/10/iStock_000002082925Medium.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/11/golf2.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 335px;"&gt;
            &lt;div class="textwidget"&gt;
                &lt;p&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/10/Sunnyside-015.jpg"&gt;
                &lt;/p&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://yourwhiteknight.com/wp-content/uploads/2012/10/iStock_000018294410Medium.png"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 10; opacity: 0; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://www.yourwhiteknight.com/wp-content/uploads/2012/10/cars.1200.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="feat_box" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 11; opacity: 1; width: 1113px; height: 325px;"&gt;
            &lt;div class="textwidget"&gt;&lt;img src="http://www.yourwhiteknight.com/wp-content/uploads/2012/10/balloons-1200.jpg"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>It looks like it is the <code>.topshadow</code> class, but I am not sure what should be put in here.</p>