Image's stretching in Safari and Chrome

Question

I am displaying lot of images for advertisements. In firefox it works fine. But in safari and chrome, it shows some strech images. An example is attached here. Anyone have any idea how to solve this?

My code is like,

   <style>  
    #globalpsa {
    width:100%;
    height:100%;
    border:3px double #fff;
    margin:2% auto;
    }
   #globalpsa input[type="image"] {
    width:100%;
    height:100%;
    }
    </style>

    <div id="globalpsa">
    <a> 
     <input type="image" src="/images/advert_images/ban2.jpg" alt="globalpsa"    
     name="globalpsa"/>          
     </a>
     </div>

Thanks,

Answer 1

Remove the height and check out the image. By default, images are proportional.

<style>  
 #globalpsa {
  width:100%;
  /* height:100%; remove this */
  border:3px double #fff;
  margin:2% auto;
 }
 #globalpsa input[type="image"] {
  width:100%;
  /* height:100%; remove this */
 }
</style>