Impossible de cocher les checkbox

Bonsoir
j'ai un probléme avec un formulaier, la cases checkbox sont impossible à cocher sur IE, ça marche quand je met tous les checkbox sur la même ligne, et ça bug dés qu'il ya unr etour à la ligne, dans certains cas ou j'ai 2 elements radio par exemple, ça marche car j'ai pas besoin de mettre des BR, mais dés qu'il ya plusieurs elements checkbox dans un calques fixé au niveau de la largeur, il ya forcément retour à la ligne même si je le specifie pas, ce qui fait que ça ne marche pas.

voila le code html :

<div class="toggler">
<span class="title_form"><a href="#typeAnon">Type de recherche :</a>
</span>
</div>
						
<div class="accordeon">
<div id="fond_form_01">
</div>
<div id="fond_form_02">
 <div id="liste_champs">
			
<input type="checkbox" name="appart" value="appart" onClick="test()" />
Appartement
									
<input type="checkbox" name="maison" value="maison" onClick="test()" />
Maison
									 
<input type="checkbox" name="chambre" value="villa" onClick="test()" />
Villa
									
<input type="checkbox" name="Terrain" value="Terrain" />
Terrain
									
 <input type="checkbox" name="Local" value="Local"  />
 Local commercial
									
<input type="checkbox" name="Bureau" value="Bureau"  />
Bureau
<input type="checkbox" name="Garage/parking"  value="Garage/parking"  />
Garage/parking
</div>
</div>
<div id="fond_form_03">
</div>

code css des divs concernés :

#fond_form_01 {
	background-image:url(../images/fond_form_01.png);
	background-position:center;
	background-repeat:no-repeat;
	width:203px;
	height:29px;	
	margin-left:auto;
	margin-right:auto;	
	}

#fond_form_02 {
	background-image:url(../images/fond_form_02.png);
	background-position:center;
	background-repeat:repeat-y;
	
	width:203px;
	margin-left:auto;
	margin-right:auto;	
}

#fond_form_03 {
	background-image:url(../images/fond_form_03.png);
	background-position:center;
	background-repeat:no-repeat;
	width:203px;
	height:31px;
	margin-left:auto;
	margin-right:auto;	
}


#liste_champs {
	margin-left:40px;
	margin-top:5px;
	text-align:left;
	width:152px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color: #000000;
}
#form_rech .toggler{
	background-image:url(../images/fond_titre_form.png);
	background-repeat:no-repeat;
	width:153px;
	height:50px;
	padding-left:41px;
	background-position:center;
	
	margin-left:auto;
	margin-right:auto;
	margin-bottom:-20px;
	
	 }

ça me prend la tête depuis quelques heures, j'espére avoir une reponse dans ce forum.

merci d'avance
Modifié par wrung06 (19 Dec 2006 - 20:21)

j'ai identifier le problème mais toujours pas de solution, apparemnt les cases sont désactivé a cause du fond background <div id="fond_form_02">.
je ne comprend toujours pas, la même page marche sur Firefox.

j'ai un peu avancer dans mes recherches, apparemet IE n'aime pas les png en background, j'arrive à les afficher avec un javascript utilisant la fonction microsoft, mais le formulaire n'est pas executer car j'y applique des fonctions onClick.

qulequ'un aurai une astuce pour contourner ce probléme??

merci d'avance
Modifié par wrung06 (20 Dec 2006 - 02:02)

Oui c'est un problème connu lorsque l'on utilise la propriété filter pour afficher des png en background, les liens ou les éléments de formulaire sont inactifs.

Un petit position:relative sur ton bloc (fond_form_02) devrait résoudre le souci