1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>rendre un label contenant une image cliquable sous IE</title>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<style type="text/css">
* {margin:0;padding:0;}
body {margin:10px;background:#000;color:#ddd;font-size:1em;font-family:Helvetica, Arial, sans-serif;}
p {margin:5px 0;padding:5px;background:#333;}
label {margin:0 2em 0 0;width:5em;display:block;float:left;text-indent:-5000em;}
#l1 {background:#666 no-repeat url("img/1.png") ;}
#l2 {background:#666 no-repeat url("img/2.png");}
</style>
</head>
<body>
<form id="f" method="post">
<p><label id="l1" for="r1">homme</label><input id="r1" name="r" type="radio" value="homme" /></p>
<p><label id="l2" for="r2">femme</label><input id="r2" name="r" type="radio" value="femme" /></p>
</form>
<p>Attention : si les images sont désactivées , mais pas le CSS, il n'y aura plus aucune instruction visible concernant ces boutons</p>
</body>
</html> |
Partager