Bonjour , j'ai toute à l'heure crée un petit design de template WEB (un test) sur le logiciel Photoshop , mais j'ai un problème.

Lorsque j'ai enregistré / découpez mes fichier images (par exemple , une image pour mon footer) Nom : FooterS.png
Affichages : 937
Taille : 7,2 Ko
Quand je veut la mettre par dessus mon background qui est celui-ci : Nom : background.png
Affichages : 5673
Taille : 1,07 Mo

Les fichiers ne se superposent pas , ils sont les uns à la suite alors que leur z-index est différent , mais peut que j'ai fait une gourde dans le CSS , en tout cas pour la page PHP (pour l'instant , j'ai mis l'image du Footer dans le Body juste pour test mais je mettrait ensuite dans le <footer>.

Voici l'image problème : Nom : pba.PNG
Affichages : 1025
Taille : 1,00 Mo

Code CSS :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
.background {
  background-image: url("background.png");
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1980px;
  height: 1200px;
  z-index: 1;
}
 
.FooterS {
  background-image: url("FooterS.png");
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1980px;
  height: 121px;
  z-index: 2;
}
Code HTML :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
    <title>Projet DEV</title>
    <meta charset="UTF-8" />
</head>
 
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <img class="background" src="images/background.png">
    <img class="FooterS" src="images/FooterS.png">
</body>
<footer>
</footer>
</html>

Merci de vos suggestion et désolé si mon explication n'est pas claire x)