Aligné à gauche et à droite alignement dans le div dans le Bootstrap
Quels sont certains des moyens communs pour aligner à gauche du texte et de l'aligner à droite un autre texte dans un div conteneur dans le bootstrap?
par exemple
Total cost $42
Au-dessus du coût total devrait être aligné à gauche du texte et $42 est aligné à droite du texte
Vous devez vous connecter pour publier un commentaire.
2018 mise à Jour...
Bootstrap 4.1+
pull-right
est maintenantfloat-right
text-right
est le même que 3.x, et travaille pour des éléments inlinefloat-*
ettext-*
sont réactif pour l'alignement différent à différentes largeurs (ie:float-sm-right
)La flexbox utils (par exemple:
justify-content-between
) peut également être utilisé pour l'alignement:ou, auto-marges (par exemple:
ml-auto
) dans les flexbox conteneur (ligne,barre de navigation,carte,d-flex,etc...)Bootstrap 4 Alignez Démo
Bootstrap 4 Aligner À Droite Des Exemples(float, flexbox, texte-droit, etc...)
Bootstrap 3
Utiliser le
pull-right
classe..Bootstrap 3 Demo
Vous pouvez également utiliser le
text-right
classe comme ceci:Bootstrap 3 Demo 2
text-right
a fonctionné pour moi.text-right
est très efficace pour Bootstrap 3, comme suggéré par Florin.Au lieu d'utiliser
pull-right
classe, il est préférable d'utilisertext-right
classe dans la colonne, parce quepull-right
crée parfois des difficultés lors du redimensionnement de la page.Dans le Bootstrap 4 la réponse correcte est d'utiliser letext-xs-right
classe.Ceci fonctionne parce quexs
désigne la plus petite taille de la fenêtre dans BS. Si vous vouliez, vous pourriez demander l'alignement uniquement lorsque la fenêtre est plus grande ou moyenne en utilisanttext-md-right
.Dans la dernière alpha,
text-xs-right
a été simplifiée pourtext-right
.Bootstrap v4 introduit flexbox soutien
En savoir plus à https://v4-alpha.getbootstrap.com/utilities/flexbox/
Nous pouvons atteindre par Bootstrap 4 Flexbox:
Exemple: JSFiddle
Qui devrait faire le travail tout simplement ok