1485 sujets

Web Mobile et responsive web design

Bonjour

J'ai un gros soucis avec le background-image.

En effet sur PC, aucun problème mais sur tablette et smartphone, il agrandit tellement l'image qu'on ne voit rien...

J'ai testé sur Iphone, et Ipad ainsi que sur les samsung galaxy tab.

Mon code est le suivant :

  background-image:  url("../img/fond.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;


J'ai essayé en modifiant la photo pour les iphone 5s afin de faire des tests mais sans succès

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

  html{
    background-image: url("../img/fondiphone.png") !important;
    background-size: 568px 568px !important;
    background-attachment:fixed!important;
    background-position: top center;
  }
}

Dans le dernier cas, la photo prend bien l'écran mais elle ne reste pas figé lors du scroll

Avez-vous une idée?

Merci