Discussion :

[Arget]

Bonjour à tous,
Me voilà en train de m'arracher les cheveux face à un problème dont je ne trouve pas la solution, alors que je cherche depuis un certain temps..

Pour vous conter l'histoire:
Je souhaite afficher les différents éléments d'une table mysql.. J'étais donc parti sur des div à la base, mais le problème, évident, c'est que ce n'est pas très droit ^^.
Du coup, je suis parti sur l'optique de créer un tableau affichant ainsi tous les éléments .. Chose qui marche parfaitement .. MAIS ! Dans mon essai précédent, avec les div, j'utilisais une propriété CSS me permettant d'afficher Deux liens: "editer / supprimer" lors du passage de la souris sur une div.
Problème: Ils ne s'affichent pas depuis l'intégration du tableau, et restent en "display:none".

Bref, passons au code, je vous présente tout d'abord le code de la page utilisateurs.php:

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<div class="<?php echo $content; ?>">
 
    <h2>Affichage des <?php echo $content; ?>s</h2>
 
    <?php
        if(isset($_GET['erreur'])){
            
            if($_GET['erreur'] == 1){
                echo "<span style='color:red'>Une erreur est survenue ...</span>";
            }else {
                echo "<span style='color:#106409'>Modification r&eacute;ussie.</span>";
            }
            echo "<br/>";
            
        }
    ?>
 
 
 
 
        <table class="displaycategorie">
 
            <tr class="onecategory">
                <th class='checkbox' height=80px width='5%'>
                    S&eacute;lection
                </th>
                <th class='id' width='10%'>
                    ID
                </th>
                <th class='name' width='20%'>
                Nom
                </th>
                <th class='prenom' width='80%'>
                    Prenom
                </th>
                </tr>
 
                <form name="selection" method="post" action="?content=<?php echo $content; ?>">
                    <?php
                        $i = 0;
                        foreach($liste as $uneLigne){
                            $i++;
                            echo "
                                <tr class='onecategory'>
                                
                                    <td class='checkbox'>
                                        <input type='checkbox' name='selection[]' value='".$uneLigne->getId()."' />
                                    </td>
                                    <td class='id'>
                                        <a href=index.php?content=".$content."-edit&id=".$uneLigne->getId().">".$uneLigne->getId()."</a>
                                    </td>
                                    <td class='name'>
                                        <a href=index.php?content=".$content."-edit&id=".$uneLigne->getId().">".$uneLigne->getNom()."</a>
                                        <div class='edit-delete'>
                                            <a href='index.php?content=".$content."-edit&id=".$uneLigne->getId()."' title='Editer'>Editer</a> | 
                                            <a href='index.php?content=".$content."-delete&id=".$uneLigne->getId()."' title='Supprimer' onclick=\"if ( confirm( 'Vous etes sur le point de supprimer cet &eacute;l&eacute;ment.\n\nAnnuler pour abandonner, \nOK pour le supprimer.' ) ) { return true;}return false;\">Supprimer</a>
                                        </div>
                                    </td>
                                    <td class='prenom'>
                                        <a href=index.php?content=".$content."-edit&id=".$uneLigne->getId().">".$uneLigne->getPrenom()."</a>
                                    </td>
                                   
                                </tr>
                                
                            
                            ";
                            
                        }
                        
                        echo "<input type='hidden' name='valuei' value=".$i." />"
                        
                    ?>
                </form>
 
        </table>
 
 
 
    <div class="boutons">
        <br/>
        <a href='javascript:document.selection.submit();' title="Supprimer des <?php echo $content; ?>s" onclick="if ( confirm( 'Vous etes sur le point de supprimer cet &eacute;l&eacute;ment.\n\nAnnuler pour abandonner, \nOK pour le supprimer.' ) ) { return true;}return false;">Supprimer la selection</a>
        <a href="index.php?content=<?php echo $content; ?>-add" title="Ajouter une <?php echo $content; ?>" >Ajouter un utilisateur</a>
 
    </div>
    <br/>
</div>

Et pour finir, le code du style.css:

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
/* PAGE UTILISATEUR
-----------------------------------------------------*/
 
 
#content .utilisateur {
 
	float: left;
	width: 98%;
	height: 80%;
	margin-top: 20px;
	background: #e1dfdf;
	padding: 15px 15px 15px 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	box-shadow: 1px 2px 2px 2px #6d6a6a;
 
}
 
#content .utilisateur .boutons a{
 
	text-decoration: none;
	color: #302e2e;
	font-size: 14px;
	font-style: oblique;
	font-weight: bold;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background: #cec8c8;
	padding: 8px 8px 8px 8px;
 
}
 
#content .utilisateur .boutons a:hover{
 
	color: #2c77e7;
 
}
 
#content .utilisateur .displaycategorie {
 
	width:80%;
	height: 70%;
	background: white;
	padding: 5px 5px;
	-moz-border-radius: 10px;
	border-radius: 10px;
 
}
 
#content .utilisateur .displaycategorie .onecategory a{
 
	text-decoration: none;
	color: #302e2e;
	font-size: 15px;
	font-style: oblique;
	font-weight: bold;
 
}
 
#content .utilisateur .displaycategorie .onecategory {
 
	border-bottom: 1px solid #e1dfdf;
 
}
 
#content .utilisateur .displaycategorie .onecategory .id {
 
	/*float:left;	*/
	/*margin-left: 2%;*/
	color: #5b4512;
	width: 5%;
 
}
 
#content .utilisateur .displaycategorie .onecategory .name {
 
	/*float:left;*/
	/*margin-left: 20%;*/
	color: #5b4512;
 
}
 
#content .utilisateur .displaycategorie .onecategory .name a {
 
	color: #3d4d89;
 
}
 
#content .utilisateur .displaycategorie .onecategory .prenom {
 
	/*float:left;*/
	/*margin-left: 20%;*/
	color: #5b4512;
 
}
 
#content .utilisateur .displaycategorie .onecategory .prenom a {
 
	color: #3d4d89;
 
}
 
#content .utilisateur .displaycategorie .onecategory .checkbox {
 
	/*float:left;*/
	color: #5b4512;
 
}
 
#content .utilisateur .displaycategorie .onecategory:hover > .edit-delete {
 
	display: block;
	color: red;
	font-size: 12px;
	margin-left: 24%;
 
}
 
 
 
#content .utilisateur .displaycategorie .onecategory .edit-delete {
 
	display: none;
 
}
 
#content .utilisateur tr {
 
	text-align: center;
}

Voilà, je remercie beaucoup toute personne qui aura le courage de m'aider .

[Arget]

Bon, et bien j'ai l'air malin ^^.
Ne pouvant lacher l'affaire, j'ai continué à chercher, et j'ai trouvé la solution moi-même:
Tout d'abord, le chemin indiqué dans le css n'était pas le bon pour le "onecategory:hover"
Je l'ai donc modifié en:

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
#content .utilisateur .displaycategorie .onecategory:hover >  .name .edit-delete {
 
	display: block;
	color: red;
	font-size: 12px;
 
}
 
 
 
#content .utilisateur .displaycategorie .onecategory .name .edit-delete {
 
	display: none;
 
}

Et pour finir, j'ai remplacé ma "div edit-delete" en <span class="edit-delete">

Bonne journée à tous