1 pièce(s) jointe(s)
Compatibilité Firefox : background-image
Bonjour,
Le but est d'afficher dans l'angle (haut-gauche) de la page une zone en arc de cercle avec une icône à l'intérieur (via background-image : back.png est une simple flèche vers la gauche de 18*14 pixels, ci-jointe). Lorsque le curseur survole la zone celle-ci change de couleur, et un clic permet de naviguer vers la page précédente.
Le code ci-dessous fonctionne très bien avec IE, Chrome, Safari et Opera mais pas avec Firefox.
Savez-vous pourquoi ?
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
| <!DOCTYPE html>
<html lang="fr">
<head>
<title>Test css avec firefox</title>
<style>
#back {
position: absolute;
top: -20px;
left: -20px;
width: 50px;
height: 50px;
background-color: orangered;
-moz-border-radius: 25px;
-webkit-border-radius: 25px;
border-radius: 25px;
line-height: 50px;
background-image: url("back.png");
background-repeat: no-repeat;
background-position-x: 22px;
background-position-y: 24px;
}
#back:hover {
background-color: yellow;
}
</style>
</head>
<body>
<a href="javascript:history.back()"><div id="back"></div></a>
</body>
</html> |