Bonjour à tous!
J'essaie d'améliorer la mise en forme de mes formulaires et pour cela je voudrais qu'ils soient à coter horizontalement.
Voici mes codes :
je vous remercie par avance!
Modifié par alex9869 (13 Apr 2019 - 17:48)
J'essaie d'améliorer la mise en forme de mes formulaires et pour cela je voudrais qu'ils soient à coter horizontalement.
Voici mes codes :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"W>
<title>Faire un don </title>
<link href="../css/test.css" rel="stylesheet" /> <!-- On va chercher le fichier CSS -->
</head>
<body>
<header>
<div> <a href="accueil.html"> <img src="images/tortue.jpg" alt="logo_tortue" class="logo"> </a> </div>
<div> <a class="logo_nom" href="accueil.html"> La tortue </a> </div>
<nav class="nav">
<ul>
<li> <a href="qui_sommes_nous.html" class="titre"> Qui sommes nous ? </a> </li>
<li> <a href="champs_d'action.html"> Nos champs d'action </a> </li>
<li> <a href="agir.html"> Agir </a> </li>
<li> <a href="contact.html"> Contact </a> </li>
<li> <a href="FAQ.html"> FAQ </a> </li>
<li id="faire_un_don"> <a href="faire_un_don.html" title="c'est grâce à vous que nous pouvons agir" target="_blank"> Faire un don </a> </li>
</ul>
</nav>
</header>
<main id="don">
<form>
<div class="donne">
<fieldset> <!-- Un deuxième formulaire qui permet de faire un don. Le type radio permet de cocher un case. Ou le type text pour remplir un montant particuler. -->
<legend> Le montant que je donne </legend>
<p>
<input type="radio" name="don" value="10" /> 10€
<input type="radio" name="don" value="20" /> 20€
<input type="radio" name="don" value="50" /> 50€
<input type="radio" name="don" value="100" /> 100€ <br /> <br />
Saisir un autre montant : <input type="text" name="don" value="" />
</p>
</fieldset>
<fieldset>
<legend> Mes coordonnées </legend>
<p> Ces informations sont nécessaires à l'établissement de votre reçu fiscal. </p>
nom : <input type="text" name="nom" value="" /></br><br/>
prenom : <input type="text" name="prenom" value="" /></br><br/>
email : <input type="email" /></br><br/>
telephone : <input type="tel" /></br><br/>
adresse :<input type="text" name="adresse" value="" /></br><br/>
ville : <input type="text" name="ville" value="" /></br><br/>
code postal : <input type="text" name="cp" value="" /></br>
</fieldset>
</div>
<div class="donne">
<fieldset>
<legend> Mon réglement </legend>
<p> Cette page est 100% sécurisée. </p>
<p> SÉLECTIONNEZ VOTRE CARTE DE PAIEMENT </p>
<div class="type">
<p>
<input type="radio" name="type" value="MC" />
<label for="type"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a4/Mastercard_2019_logo.svg/1200px-Mastercard_2019_logo.svg.png" alt="" /></label>
<input type="radio" name="type" value="V" />
<label for="type"><img src="https://d1yjjnpx0p53s8.cloudfront.net/styles/logo-thumbnail/s3/0013/4323/brand.gif?itok=fSmoZrGH" alt="" /></label>
<input type="radio" name="type" value="CB" />
<label for="type"><img src="https://www.reussir-mon-ecommerce.fr/wp-content/uploads/2016/03/logo-cb-1.jpg" alt="" /></label>
</p>
</div>
<p>
saisissez votre numéro de carte bancaire : <input type="text" name="numcarte" value="" maxlength="16"></br><br/>
date d'expiration : <input type="date" name="date_expir"></br><br/>
code de sécurité : <input type="password" name="code" maxlength="3" maxlength="3" /></br><br/>
</p>
</fieldset>
<p>
<input type="submit" value="Valider mon don par carte bancaire" />
</p>
</div>
</form>
</main>
#don {
display : flex;
justify-content: space-around;
}
je vous remercie par avance!
Modifié par alex9869 (13 Apr 2019 - 17:48)