html - 图片在 Safari 和 Chrome 中的拉伸

Question

我正在展示很多广告图片。在Firefox中它工作正常。但在 safari 和 chrome 中，它显示了一些拉伸图像。此处附有一个示例。有人知道如何解决这个问题吗？

我的代码就像，

   <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>

谢谢，

Answer 1

删除高度并检查图像。默认情况下，图像是成比例的。

<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>