横幅中的图像在IPhones和IPads中产生偏差

Question

问题：我有以下css来使转盘横幅中的图片响应：

#homepage .carousel .item { 
     height: auto;
} 
/*Carousel images are now responsive*/
#homepage .carousel .item img { 
    min-width: 100% !important; 
    max-width: 100% !important; 
    position: relative !important; 
}

适用于PC，平板电脑和Android设备。

然而，对于IPads和IPhones，图像偏斜。它似乎显示图像的完整高度，而不是根据设备进行调整。

我有以下用于处理IPads和IPhones的css样式表：

@media screen and (-webkit-min-device-pixel-ratio: 0) and (max-width: 991px) and (min-width: 768px){
    #homepage .carousel .item {
        /*height: auto !important;*/
        margin-top: 154px !important;
    }
}
@media screen and (max-width: 991px) and (min-width: 768px) and (orientation:landscape){
    #homepage .carousel .item {
        /*height: auto !important;*/
        margin-top: 20px;
    }
}
@media (max-width:961px) and (min-width: 768px) and (orientation:landscape){
    #homepage .carousel .carousel-caption { 
        top: -20px !important;
    }
}
/* Portrait and Landscape iphone*/
@media only screen 
  and (max-device-width: 480px) 
  and (orientation:portrait) { 
    #homepage .carousel .item { height: 150px !important; /*margin-top:71px;*/}
    #homepage .carousel .item img { max-width: 100%; height: auto; display: block; }

}
@media only screen 
  and (max-device-width: 480px) 
  and (orientation:landscape) { 
    #homepage .carousel .item { height: 250px !important; }
    #homepage .carousel .item img { max-width: 100%; height: auto; display: block; }
}

但是，我使用的js似乎不起作用：

function isApple(userAgent){
     var iPhone = userAgent.match(/iPhone/i) !== null;
     var Apple = userAgent.match(/Apple/i) !== null;
     var Mac = userAgent.match(/Mac/i) !== null;
     var iPod = userAgent.match(/iPod/i) !== null;
     var iOS = userAgent.match(/iOS/i) !== null;
          return iPhone || Apple || Mac || iPod || iOS;
        }
        // Use like this...
  if(isApple(navigator.userAgent)){ 
          document.getElementsByTagName('head')[0].insertAdjacentHTML('beforeend', '<link rel="stylesheet" href="/MuraBootstrap3/assets/bootstrap/css/iphone.css">');
        }

如何使IPhones和IPads的图像不偏斜？

由于