Bonsoir,
Je tente de mettre une classe et un id (ou une ?) sur une div mais ça ne fonctionne pas... J'ai cherché sur le net et apparemment, c'est censé fonctionner mais je ne vois pas où est le problème.
Voici le code et les images sont ici : http://forum.alsacreations.com/topic-4-70091-1-Resolu-Nafficher-quune-partie-dune-image-ca-fonctionne-pas.html
Merci d'avance
Je tente de mettre une classe et un id (ou une ?) sur une div mais ça ne fonctionne pas... J'ai cherché sur le net et apparemment, c'est censé fonctionner mais je ne vois pas où est le problème.
Voici le code et les images sont ici : http://forum.alsacreations.com/topic-4-70091-1-Resolu-Nafficher-quune-partie-dune-image-ca-fonctionne-pas.html
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Trions nos déchets</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="tri.css" />
</head>
<body>
<div id="fond">
<div id='dechets' class='banane'>
</div>
</div>
<script type="text/javascript" src="tri.js">
</script>
</body>
</html>
#fond
{
background: url(http://forum.alsacreations.com/upload/50936-poubelles2.png) no-repeat center center;
width:50%;
padding-top:36.5%;/* ratio image = (500px X 365px) */
margin:auto;
background-size:100%;
position:relative;
}
#dechets
{
position:absolute;
top:40%;
left:42%;
width:10.8%;
padding-top:12%;/* ratio sprite = 108 X 120 */
background:url(http://forum.alsacreations.com/upload/50936-dechets.png);
background-size:520%;
background-position: 50% 0% /*pas de 25% en 25% et de 50% en 50%*/
}
.eau
{
background-position: 0% 0%;
}
.banane
{
background-position: 25% 0%;
}
Merci d'avance