title: Center image on jQuery Slider in HTML
body: <p>I have an jQuery Content Slider. But i have an problem, where tall images is stretch. Isn't it possible to center the image. Some says that i need to set the overflow to hidden. But it doesn't make any differences. 
  Best regard Morten Starck</p>
  
  <p>The html code:</p>
  
  <pre><code> &lt;ul class="bxslider"&gt;
  &lt;li&gt;
    &lt;img id="propImageSliderLarge" src="http://billeder.edc.dk/edcmedia/2012/04-April/04/4fac343a-5d4b-4aab-8205-f57f165bc484_Size687x458.jpg"/&gt;&lt;/li&gt;
  &lt;li&gt;
    &lt;img id="propImageSliderLarge" src="http://billeder.edc.dk/edcmedia/2012/04-April/04/7bdfb0cc-47ec-4afa-9fc7-aa2cbb9d43a0_Size687x458.jpg"/&gt;&lt;/li&gt;
  &lt;li&gt;
    &lt;img id="propImageSliderLarge" src="http://billeder.edc.dk/edcmedia/2012/04-April/04/aad1d457-285d-42e3-8e68-e243bd2988d4_Size687x458.jpg"/&gt;&lt;/li&gt;
  &lt;li&gt;
    &lt;img id="propImageSliderLarge" src="http://billeder.edc.dk/edcmedia/2012/04-April/04/768fda69-af61-4322-a60b-012040d78384_Size687x458.jpg"/&gt;&lt;/li&gt;
  &lt;li&gt;
    &lt;img id="propImageSliderLarge" onload="FixImages(true)" src="http://www.blog.designsquish.com/images/uploads/victorian-flatbush-old-hous_thumb.jpg" /&gt;&lt;/li&gt;
  </code></pre>
  
  <p></p>
  
  <p>
      
        
      
        
      
        
      
        
      
        
    </p>
  
  <p>And the Javascript:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    $('.bxslider').bxSlider({
      pagerCustom: '#bx-pager'
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>and the CSS code:</p>
  
  <pre><code>#propImageSliderLarge {
    width: 530px;
    height: 400px;
    overflow: hidden; 
    position: relative;
  }
  </code></pre>