Bonjour, tout d'abord pour mieux comprendre voici ma page :
Comme vous pouvez le voir j'ai dans mon container un tableau puis en dessous, un formulaire.
ce que je souhaite faire, c'est pouvoir faire un autre formulaire à la droite du premier mais je ne maitrise pas encore parfaitement les grilles bootstrap pour réaliser ça..
Faudra surement enlever le col-md-4 de la balise <div> du haut et après tu répète tout ce qu'il y a entre la balise <article></article> et cela devrait le faire sinon tu t'embête pas et tu crée un tableau html avec <table>
Une bonne vieille façon : utiliser deux div flottants. float: left) - ne pas oublier de supprier les flottants par un <br style="clear:both">
Les jeunes préférerons un élément dont la propriété display est fixée à flex comme conteneur général.
Il y a d'autres façon : tableau (pas bien ! nous dit-on) et colonnes (qu'IE ne comprend pas) cela dit, le flex n'est pas non plus supporté par les anciennes versions de IE.
Bonjour @Lamecarlate, j'ai essayé d'utiliser la grille mais sans réussite, mon deuxieme formulaire s'ajoutant toujours en dessous du premier et non à sa droite.
Bonjour @Domi65, j'ai aussi essayé ta méthode avec les float right et left, et j'arrive au même résultat...
EDIT : J'ai réussi à faire ce que je voulais, je vous le partage si quelqu'un a besoin à l'avenir :
<div class="row">
<div class="col">
<h2>Renseigner un client</h2>
<form class="needs-validation" action="index.php" method="post" novalidate>
<label for="validationCustom01">Prénom</label>
<input type="text" class="form-control" id="validationCustom01" placeholder="Karim" name="prenom" value="" required>
<div class="valid-feedback">
Vérifié
</div>
<label for="validationCustom02">Nom de famille</label>
<input type="text" class="form-control" id="validationCustom02" placeholder="Benzema" name="nom" value="" required>
<div class="valid-feedback">
Vérifié
</div>
<label for="validationCustom03">Téléphone</label>
<input type="text" class="form-control" id="validationCustom03" placeholder="0612345678" name="tel" required>
<div class="invalid-feedback">
Merci de renseigner un numéro de téléphone valide.
</div>
<label for="exampleInputEmail1">Email</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="@" name="email">
<small id="emailHelp" class="form-text text-muted"></small>
<label for="validationCustom05">Adresse</label>
<input type="text" class="form-control" id="validationCustom05" placeholder="21 Avenue des champs Elysées" name="adresse" required>
<div class="invalid-feedback">
Merci de renseigner une ville.
</div>
<label for="validationCustom05">Ville</label>
<input type="text" class="form-control" id="validationCustom05" placeholder="Angers" name="ville" required>
<div class="invalid-feedback">
Merci de renseigner une ville.
</div>
<label for="validationCustom05">Code Postal</label>
<input type="text" class="form-control" id="validationCustom05" placeholder="49000" name="codePostal" required>
<div class="invalid-feedback">
Merci de renseigner un code postal.
</div>
<label for="validationCustom05">Adresse de l'installation</label>
<input type="text" class="form-control" placeholder="21 Avenue des champs Elysées" name="adresseInstall">
<label for="validationCustom05">Ville de l'installation</label>
<input type="text" class="form-control" placeholder="Le Mans" name="villeInstall">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="invalidCheck" required>
<label class="form-check-label" for="invalidCheck">
Je ne suis pas un robot
</label>
<div class="invalid-feedback">
Vous devez cocher la case de vérification.
</div>
</div>
<button class="btn btn-primary" name='valider' type="submit">Valider le client</button>
</form>
</div>
<div class="col">
<h2>Renseigner un nouvel ouvrage</h2>
<form class="needs-validation" action="index.php" method="post">
<label for="validationCustom01">Ouvrage</label>
<input type="text" class="form-control" id="validationCustom01" placeholder="Pompe à chaleur Aquarea monophasé" name="nomProduit" value="" required>
<div class="valid-feedback">
Ok
</div>
<label for="validationCustom01">Description</label>
<input type="text" class="form-control" id="validationCustom01" placeholder="Commentaire supplémentaire" name="libelle" value="" required>
<div class="valid-feedback">
Ok
</div>
<label for="validationCustom01">Prix</label>
<input type="text" class="form-control" id="validationCustom01" placeholder="777.45" name="prixProduit" value="" required>
<div class="valid-feedback">
Ok
</div>
<label for="validationCustom01">Famille</label>
<input type="text" class="form-control" id="validationCustom01" placeholder="Pompes" name="prixProduit" value="" required>
<div class="valid-feedback">
Ok
</div>
</br>
<button class="btn btn-primary" name='subOuvrage' type="submit">Enregistrer l'ouvrage</button>
</form>
</div>
</div>
- Edité par anonov 15 janvier 2021 à 15:06:53
[Bootstrap] Couper ma page en deux
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Bonjour à tu essayé avec article genre comme ce si Faudra surement enlever le col-md-4 de la balise <div> du haut et après tu répète tout ce qu'il y a entre la balise <article></article> et cela devrait le faire sinon tu t'embête pas et tu crée un tableau html avec <table>
Pas d'aide concernant le code par MP, le forum est là pour ça :)