-1
votes

Comment aligner un élément de formulaire au centre de la page?

J'ai une page de connexion et je souhaite aligner l'élément de formulaire au centre de la page.

<form>
  <input class="signininp" type="input" name="email">
  <br>
  <input class="signininp" type="input" name="pass">
  <br>
  <input class="signininp" type="submit" name="submit" value="GiriÅŸ Yap">
</form>

html css forms

2 commentaires

Je ne peux pas faire ce que je veux avec «».

Oubliez l'élément central, c'est obsolète.

5 Réponses :

-1
votes

body {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
}

2 commentaires

J'ai essayé un code comme celui-ci mais ça n'a pas fonctionné pour moi

Bonjour! Alors que ce code peut résoudre la question, , y compris une explication de la manière et pourquoi cela résout le problème aiderait vraiment à améliorer la qualité de la qualité. de votre message et aboutit probablement à plus de votes. N'oubliez pas que vous répondez à la question des lecteurs à l'avenir, pas seulement la personne qui demande maintenant. S'il vous plaît Modifier Votre réponse Pour ajouter des explications et donner une indication de quelles limitations et hypothèses s'appliquent.

0
votes

Vous pouvez utiliser Flex pour aligner sur le centre de la page - il suffit de envelopper le formulaire dans un div avec Affichage: flex et hauteur: 100vh code> - puis appliquer marge: auto Code> à votre formulaire.

p>



<div class="form-wrapper">
  <form>
    <input class="signininp" type="input" name="email"/>
    <br>
    <input class="signininp" type="input" name="pass"/>
    <br>
    <input class="signininp" type="submit" name="submit" value="GiriÅŸ Yap">
  </form>
</div>

0 commentaires

-1
votes

Mettez votre formulaire à l'intérieur d'une balise div et xxx

Ajoutez ceci à votre fichier CSS.

0 commentaires

0
votes

ajoutez le CSS suivant:

body {
    display: flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    height: 100vh;
}
form{
    width: 20%;
}

0 commentaires

0
votes

Checkout Pour utiliser la balise

  CODE>, il résout la plupart de mes problèmes HTML  `   <center><form>
    <input class="signininp" type="input" name="email"/>
    <br>
    <input class="signininp" type="input" name="pass"/>
    <br>
    <input class="signininp" type="submit" name="submit" 
       value="GiriÅŸ Yap">
       </form></center>`

2 commentaires

Il est utilisé dans HTML 4 et ses versions précédentes. mais pas dans html5 Vérifiez ce pour connaître le remplacement de la balise centrale

@Giritejabille Merci, je vais savoir que je sache comme je suis nouveau à la programmation, je suis juste 15