J'ai ce formulaire:
<div class="container-fluid"> <div class="span5 well"> <h2>Authentification</h2> <form method="POST">...</form> </div> </div>
4 Réponses :
Le centrage horizontal peut être effectué en ajoutant marge: 0 auto à un élément qui n'a pas de frères et sœurs.
<style>
.well
{
position:absolute;
width:200px;
height:200px;
top: 50%;
left: 50%;
margin-top:-100px; /* negative number 1/2 height */
margin-left:-100px; /* negative number 1/2 width */
outline:1px solid #CCC;
}
</style>
<div class="container-fluid">
<div class="span5 well">
<h2>Authentification</h2>
<form method="POST">...</form>
</div>
</div>
Cela ne fonctionne que si vous connaissez la hauteur de l'élément (200px dans ce cas)
Il n'y a rien de contradiction avec Bootstrap pour utiliser des JS pour cela, tels que jquery.valign plugin de jquery.valign . Je trouve cela plus simple que les astuces verticales-aligner.
Le centrage horizontal a été mentionné plus tôt pour définir la marge 0 Auto.
alignement verticalement l'élément de manière dynamique (lorsque vous ne connaissez pas la hauteur), vous pouvez le déplacer relativement 50% (haut ou bas), puis utiliser la transformation: Traducty (50%) (+/-) pour le centrer dans son conteneur parent:
Dans le conteneur ou dans le corps?
Est-ce correct? Au conteneur, s'il est accessible ...