IE11 l'habitude background-size: cover

J'ai un div #service_wrap il a une image qui devrait couvrir 100%de la largeur de la page, il fonctionne très bien sous firefox,chrome et edge. Mais IE 11 centres de l'image et ne couvre pas les div

Qu'est-ce que l'IE équivalent de background-size: cover;

css

#service_wrap{
padding:0;
margin:0;
width:100%;
height:750px;
max-height:750px;
display:table;
background: url(../images/service_header.jpg) no-repeat center center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

html

<div id="service_wrap" >

<div id="service_top" >
<h1>WE WORK CLOSELY WITH OUR PARTNERS TO GET YOU THE BEST SERVICE.</h1>
<h2>Click on a service below to learn more about how we partner with each one.</h2>
</div><!--service_top-->

<div id="service_bottom" >
<div class="services_holder">
<a href=""><div class="service1"></div></a><!--service1-->
<a href=""><div class="service2"></div></a><!--service2-->
<a href=""><div class="service3"></div></a><!--service3-->
<a href=""><div class="service4"></div></a><!--service4-->
<a href=""><div class="service5"></div></a><!--service5-->
<a href=""><div class="service6"></div></a><!--service4-->
<a href=""><div class="service7"></div></a><!--service5-->
</div><!--services_holder-->
</div><!--service_bottom-->

</div><!--service_wrap-->

IE11 l'habitude background-size: cover

IE11 l'habitude background-size: cover

Si vous insérez le code ci-dessous dans une page web sur IE11 il n'utilise pas toute la largeur

HTML:

<!DOCTYPE html>
<head>
<meta charset="utf-8">

<title>this is a title</title>

<link rel="stylesheet" href="css/partners.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />

<style>

#service_wrap{

background: url(http://test.finelinewow.com/images/partner_header.jpg) no-repeat center center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}	
</style>


</head>
<body>








<!----------------------------------------------------------------service---------------------------------------------------------------->   

<div id="service_wrap" >



<div id="service_top" >
<h1>WE WORK CLOSELY WITH OUR PARTNERS TO GET YOU THE BEST SERVICE.</h1>
<h2>Click on a service below to learn more about how we partner with each one.</h2>


</div><!--service_top-->


<div id="service_bottom" >
<div class="services_holder">
<a href="#liberty_towing"><div class="service1"></div></a><!--service1-->
<a href="#auto_palace"><div class="service2"></div></a><!--service2-->
<a href="#discount_auto"><div class="service3"></div></a><!--service3-->
<a href="#speedy_car"><div class="service4"></div></a><!--service4-->
<a href="#solid_insurance"><div class="service5"></div></a><!--service5-->
<a href="#sevan_auto"><div class="service6"></div></a><!--service4-->
<a href="#gray_gables"><div class="service7"></div></a><!--service5-->
</div><!--services_holder-->
</div><!--service_bottom-->





</div><!--service_wrap-->

<!----------------------------------------------------------------/service---------------------------------------------------------------->  


</body>
</html>

  • Mais background-size: cover travaille dans IE11, de sorte que vous devez avoir autre chose de mal
  • pas dans windows 10 à l'aide de l'ie 11 navigateur
  • Je suis sur Win 10 à l'aide d'IE11 et il fonctionne très bien
  • Essayez background: url(../images/service_header.jpg) no-repeat center fixe;
  • Elle travaille depuis IE9 : caniuse.com/#feat=background-img-opts
  • Exactement ... c'était juste sur le point d'ajouter que 🙂
  • eh bien, je ne sais pas ce qui se passe im en utilisant le html 5, j'ai le mode de compatibilité de congé, pas de zoom. ive pris tout le code à l'exception de 1 div i
  • prendre mon extrait de code pour télécharger sur ur serveur de test et u va voir, elle ne couvre pas toute la largeur de la page
  • Je viens d'essayer ton code et il fonctionne très bien
  • u peut capture d'écran pour moi?
  • test.finelinewow.com/partners.php ne fonctionne pas ici de différence pc win 7 ie 11
  • je suis un 27 pouces, 1080p , l'image est de 1 500 px × 885px donc, il faut travailler, mais u voir ma capture d'écran et mon code il devrait fonctionner, mais 3 PC différents ne sont pas
  • Voici une capture d'écran à l'aide de violon: i.stack.imgur.com/gzH26.png

InformationsquelleAutor jlitt1 | 2016-06-08
  1. 6
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    résolu le problème.
    Code du travail sur l'ordinateur local,jfiddle et codepen mais lors du téléchargement du site le code ci-dessus doivent être ajoutées pour s'afficher correctement.

    InformationsquelleAutor jlitt1