Bonjour,

Pas facile de faire un titre qui correspond à mon problème.

J'avais une table avec 3 colonnes et un lien pour la ligne (table créée dynamiquement à partir d'une base de données)
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
<div id="liste">
   <div class="ligne" onclick="faitletravail(1)">
      <span></span>
      <span></span>
      <span></span>
   </div>
   <div class="ligne"  onclick="faitletravail(2)">
      <span></span>
      <span></span>
      <span></span>
   </div>
   etc...
</div>

dans le CSS, j'avais
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
#liste div { display:table-row;}
 
#liste div span {	display:table-cell;}
J'avais une table bien organisée

Mais j'ai eu la bonne idée de vouloir ajouter une croix pour avoir la possibilité d'effacer la proposition de travail à faire et là, plus de mise en page possible

Soit je mets la croix dans la ligne intégrée à un <span>, mais le onclick correspondant ne fonctionne pas, c'est le onclick de la ligne qui prend le dessus alors j'ai changé la structure de ma ligne, mais j'ai alors perdu la mise en colonne.

structure de la page actuellement modifiée, mais je n'arrive pas à m'en sortir avec le CSS nécessaire pour avoir mes croix sur la même ligne que le texte correspondant et mes cases alignées dans 3 colonnes bien visibles.

Code html : 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
<div id="listcertifaimprimer">
   <div>
      <img src="http://standard.ressorts.org/images/publish_x.png" onclick="effacecertlist(125)" width="12" height="12" title="Effacer la demande de ce certificat">
      <span onclick="" class="txtlistebl">
         <span></span>
         <span></span>
         <span></span>
      </span>
   </div>
   <div>
      <img src="http://standard.ressorts.org/images/publish_x.png" onclick="effacecertlist(49)" width="12" height="12" title="Effacer la demande de ce certificat">
      <span onclick="" class="txtlistebl">
         <span></span>
         <span></span>
         <span></span>
      </span>
   </div>
</div>

actuellement, mon CSS correspondant :
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
21
#listcertifaimprimer div span {
	position: relative;
	display:table-row;
}
 
#listcertifaimprimer div span:hover {
	position: relative;
	display:table-row;
		background-color: black;
		color: white;
}
 
#listcertifaimprimer div span span {
	position: relative;
	padding-right: 5px; 
	padding-left: 5px; 
	width: auto; 
	text-overflow: ellipsis; 
	text-align: left; 
	display:table-cell;
}
S'il n'y a pas de solution avec le CSS, il va falloir que je récupère la position à laquelle se trouve ma première cellule que j'aurais eu le soin de décaler vers la droite pour aller y poser un div juste devant afin que ça corresponde à la bonne ligne quelque soit le navigateur (il y a toujours des différences d'affichages) et surtout, faire ça, c'est un peu une usine à gaz. Mais si j'ai pas le choix...

Merci à ceux qui vont me donner un coup de pouce sur ce problème là. (je continue de chercher de mon coté comme à chaque fois que je pose une question)

C'est visible là : http://gestion1.ressorts.org (il y a un accès de test indiqué sur la page d'accueil) puis menu BL/Factures, puis Certificats et enfin n'importe quelle liste de certificats (conformité, matière ou contrôle) puisqu'il s'agit de la même création de liste, mais avec des actions différentes ou pas d'action(pas encore programmées)

NOTA: même s'il s'agit d'un programme à allure pro, c'est surtout un développement amateur pour mon usage propre parce que je n'ai pas trouvé mon bonheur dans les programmes existants à un tarif non prohibitif.