<div>
does anyone have any ideas?
</div>


<div>
You need to change your actual image width from 752px to 100% (height auto or 100%) then it will stretch to fit its container.. By giving it an actual px size it will never respond to its containing environment. <br />
You may need to play around with the css for the hero as the image height will then be greater that your left hand menu and look a bit odd.<br />
<br />
Cheers,<br />
N
</div>


<div>
Would I change BOTH width and height to 100%?
</div>


<div>
You could although height auto will work as long as the width is set to 100%.<br />
N
</div>


<div>
The nav works good for the slider animation. &nbsp;If I change the css for the nav, then that won't look right. &nbsp;It's like a catch-22. &nbsp;fix one thing and the other goes bad.
</div>


<div>
I could have sworn I had this all working already... &nbsp;<br />
The side nav is not really normal set up. &nbsp;To do what you want, we need to hide one version of the hero for larger screens and then switch out. &nbsp;<a href="http://jsbin.com/koniximi/1/" rel="ugc">http://jsbin.com/koniximi/1/</a><br />
<br />
Now it is a matter of getting the white background back when xs.<br />
<br />

<pre><code class="code-1 nolinks" id="code-20-39893775-1"><span>   &lt;div id=&quot;xanimation_container&quot; class=&quot;hidden-xs col-xs-12 col-sm-9 ihero&quot;&gt;</span>
<span>        &lt;img src=&quot;http://nsitedesigns.com/nsitedesigns/wiplastic_scott/img/pl4_2.jpg&quot; class=&quot;img-responsive&quot; /&gt; </span>
<span>      &lt;/div&gt;</span>
<span>        &lt;div class=&quot;visible-xs ihero&quot;&gt;</span>
<span>        &lt;img src=&quot;http://nsitedesigns.com/nsitedesigns/wiplastic_scott/img/pl4_2.jpg&quot; class=&quot;img-responsive&quot; /&gt; </span>
<span>      &lt;/div&gt;</span>
<span>      </span>
<span>      &lt;!-- end hero --&gt;</span>
</code></pre>
</div>


<div>
Hi Scott,<br />
<br />
I was working on getting the slider to work and that messed up the other code you provided.
</div>


<div>
<div class="content wysiwyg-content">
How do I stretch the hero image (big pic to right of nav) so it fits the largest desktop size? &nbsp;We got the animation to work good but that is only be on the home page. &nbsp; <br />
<br />
I played around with this on the below page:<br />
<br />
<a href="http://nsitedesigns.com/nsitedesigns/wiplastic_scott/about2.html" rel="ugc">http://nsitedesigns.com/nsitedesigns/wiplastic_scott/about2.html</a><br />
<a href="http://nsitedesigns.com/nsitedesigns/wiplastic_scott/wiplastic2.css" rel="ugc">http://nsitedesigns.com/nsitedesigns/wiplastic_scott/wiplastic2.css</a>
</div>
</div>


How do I stretch the hero image (big pic to right of nav) so it fits the largest desktop size?  We got the animation to work good but that is only be on the home page.   

I played around with this on the below page:

http://nsitedesigns.com/nsitedesigns/wiplastic_scott/about2.html
http://nsitedesigns.com/nsitedesigns/wiplastic_scott/wiplastic2.css

Bootstrap - stretch hero images

Mobile web development, also known as responsive web design, is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones). A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries.

Responsive Web

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.

Web development includes all aspects of presenting content on intranets and the Internet, including delivery development, protocols, languages and standards, server software, browser clients, databases and multimedia generation.