Comment mettre deux input avec un label

Version imprimable

Bonjour j'aimerai mettre deux input l'un à coté de l'autre, mais avec un seul label, il affiche bien le deuxième label mais pas le premier.
PS: J'utilise materialize et donc je ne met pas le css, car trop volumineux

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
32
33
34
35
36
37
38
39
40
 
                    <p>
                        <div class="row">
                            <div class="col s12 m6 l6">
                                <input name="menubanquet[]" value="menu1" type="checkbox" id="mb1"/>
                            </div>
                            <div class="input-field col s12 m6 l6">
                                <input id="nombre" name="nb_personne" type="number" min="2" max="20" value="2"/>
                            </div>
                        </div>
                        <label for="mb1">
                            <div class="row menumb">
                                <div class="col s12 m12 l12">
                                    <div class="card boxPlat">
                                        <div class="card-image">
                                            <img class="responsive-img" src="images/menu_banquet/asparagus-2258018_1920.jpg">
                                        </div>
                                        <div class="card-content">
                                            <div class="row">
                                                <div class="col s12 m12 l12">
                                                    <!--J'affiche et concatène prix1-->
                                                    <?php //echo "<p>".$prix1["prix_menu"]." CHF</p>"; ?>
                                                    <h3 class="titremb">Menu <span class="dumb">à</span> 40 <span class="chfmb">CHF</span></h3>
                                                </div>
                                            </div>
                                            <!-- Je fais une boucle sur $resultat1 pour afficher tant qu'il y a quelque chose dedans -->
                                            <?php //while ($menubanquet1 = mysqli_fetch_assoc($resultat1)){ ?>
 
                                                <?php//echo $menubanquet1["descriptif"].'<br/>';?>
                                                <p class="centrermenubanquet">Carpaccio de melon et jambon cru</p>
                                                <p class="centrermenubanquet">Suprême de volaille fermier à la moutarde ancienne <br/>Riz aux petits légumes</p>
                                                <p class="center-align">Tiramisu</p>
 
                                            <?php //} ?>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </label>
                    </p>

16/08/2017, 17h16
ABCIWEB

Tu ne peux pas mettre un label pour deux input. Déjà au niveau fonctionnel quand on clique sur un label le curseur se positionne dans l'input visé par le label... le curseur ne peut pas se positionner dans deux input en même temps :roll:
Appelles ton label une légende ou un titre ou ce que tu veux mais n'utilise simplement pas le tag label qui n'est pas approprié dans ton cas.
16/08/2017, 17h27
fleedalfire

Merci, mais la case à cocher est en lien avec le label pour qu'il ce reconnaisse l'un l'autre.
il n'y a pas une autre solution.
17/08/2017, 12h18
Vil'Coyote

Citation:

Envoyé par fleedalfire

Merci, mais la case à cocher est en lien avec le label pour qu'il ce reconnaisse l'un l'autre.
il n'y a pas une autre solution.

l'autre solution est de revoir ton fonctionnement.
18/08/2017, 22h57
danielhagnoul

:salut:

Sans mettre l'anarchie dans le formulaire, on peut regrouper des éléments dans un élément <fieldset> et lui donner un titre avec <legend>, voir : https://developer.mozilla.org/fr/doc...ement/Fieldset
19/08/2017, 08h34
Invité
Bonjour,

la case à cocher n'apparait pas, justement à cause de materialize.min.css, ligne 13 :
Code:

1 2 3 4 5 [type="checkbox"]:not(:checked), [type="checkbox"]:checked { position: absolute; left: -9999px; opacity: 0; }
Cela dit, ton code est BEAUCOUP trop lourd !

des <p> dans des <div> dans des <p>... :cfou:

Comme le suggère danielhagnoul, emploie des balises avec la structure HTML correcte et la sémantique adéquate.