À la verticale du centre de bootstrap btn .bien classe

J'ai un lien que je veux centrer verticalement dans le .well classe de bootstrap cadre am et l'utilisation de la classe btn btn-danger sur la balise d'ancrage. Voici la photo ci-dessous. J'ai essayé d'utiliser vertical-align:middle; mais cela ne semble pas fonctionner. Vous pouvez voir que l'espace sur le bien n'est même pas sur le haut et le bas.

À la verticale du centre de bootstrap btn .bien classe

Voici le code HTML:

<div class="well">
   <%= link_to "Remove", thing, method: :delete, style: "font-size: 11px; float:right; ", :class => 'btn btn-danger'%>

</div>
Pouvez-vous poster le HTML complet de l'endroit où vous l'utilisez? Nous devons définir la display à inline-block avant d'utiliser vertical-align.
Je l'ai posté. J'ai aussi essayé de définir le display: inline-block; vertical-align:middle; et qui ne semble pas fonctionner non plus.
J'ai essayé margin-top:-3px; qui semblait fonctionner, mais il n'est pas robuste qu'une solution comme je le voudrais.
Vous avez besoin de donner vertical-align: sub et puis essayer?
Pouvez-vous poster le Rendu au format HTML? ou créer un violon?

OriginalL'auteur locoboy | 2012-06-25

  1. 3

    C'est peut-être ce dont vous avez besoin: jsfiddle .

    J'ai ajouté de nouvelles classes, afin de ne pas écraser la valeur par défaut de bootstrap.

    OriginalL'auteur Xella

  2. 5

    Il semble que vous ne devriez pas (ou ne peuvent tout simplement pas) alignez verticalement un élément flottant.

    Voici ce que je propose : 

    <div class="well mywell">
    <div class="pull-right myfloater">
       <button class="btn btn-danger vcenter">Remove</button>    
    </div>
    <p><!-- things --></p>
</div>
    .mywell{
   height: 150px;
}
.myfloater {
    line-height: 150px;
}
.vcenter{
    vertical-align: middle;
}

    L'exemple vivant : http://jsfiddle.net/Sherbrow/wxM5Z/2/

    Modifier

    Mieux avec line-heightappliquée à l'élément flottant.

    OriginalL'auteur Sherbrow