Comment puis-je aligner le bouton vers le bas de la ligne/colonne dans le bootstrap?
J'ai la ligne avec 4 colonnes, chacune avec un titre et du texte. La plupart des colonnes ont la même quantité de texte et appuyez sur le bouton dans leur colonne vers le bas pour correspondre au reste de l'colonnes. Cependant une colonne a moins de texte et de ne pas pousser le bouton vers le bas assez loin.
Est-il un moyen d'aligner le bouton vers le bas de la ligne? J'aimerais réaliser et de les conserver sensible dans le même temps, de sorte qu'il ressemble à ceci lorsque l'écran est plus petit:
C'est mon balisage de la page tout à l'heure:
<div class="container">
<div class="row">
<div class="col-md-3">
<h2>Heading</h2>
<p>text here</p>
<p><a class="btn btn-default" href="#" role="button">View details >></a></p>
</div>
<div class="col-md-3">
<h2>Heading</h2>
<p>text here</p>
<p><a class="btn btn-default" href="#" role="button">View details >></a></p>
</div>
<div class="col-md-3">
<h2>Heading</h2>
<p>less text here</p>
<p><a class="btn btn-default more" href="#" role="button">View details >></a></p>
</div>
<div class="col-md-3">
<h2>Heading</h2>
<p>text here</p>
<p><a class="btn btn-default" href="#" role="button">View details >></a></p>
</div>
</div>
</div>
OriginalL'auteur Sheldon | 2014-05-29
Vous devez vous connecter pour publier un commentaire.
Il ya plusieurs façons cela peut être fait:
Donner les conteneurs d'une hauteur fixe. Ce n'est pas idéal, car pour qu'il à l'air sympa, vous aurez à définir des hauteurs différentes pour chacun des points d'arrêt.
Vous aurez également besoin de mettre le bouton de
position: absolute
,bottom: 0
et ajouter un peu de fond de padding/margin.Utiliser du javascript pour faire correspondre les hauteurs à l'aide de quelque chose comme match de hauteur. Vous aurez aussi besoin de définir les positions comme dans le point précédent.
Ajouter une ligne supplémentaire et répétez vos boutons dans les 4 nouveaux cols. Afficher ou masquer votre origine des boutons et des les nouveaux à l'aide bottes sensible classes.
OriginalL'auteur Tims
set min-hauteur est égale à quelque chose pour le texte div contenant par exemple
OriginalL'auteur A.B
Ensemble explicite de la hauteur sur le col-md-3.
OriginalL'auteur Abe Hendlish