SpinEdit вертикально выровненные кнопки

Question

Я использую Twitter Bootstrap 2.3.2. Я пытаюсь отобразить кнопки spinedit рядом с элементом управления вводом. В настоящее время у меня это выглядит так:

используя следующий HTML:

<div class="input-append">
    <input type="text" class="input-mini" type="text">
    <span class="btn-group">
        <button class="btn">
            <i class="icon icon-chevron-up"></i>
        </button>
        <button class="btn">
            <i class="icon icon-chevron-down"></i>
        </button>
    </span>
</div>

Вы можете увидеть живое демо здесь:

http://geersch.github.io/ui.cg/

Однако я пытаюсь сделать так, чтобы это выглядело как внешний вид по умолчанию для элемента управления spinedit:

Можно ли выровнять их рядом с входом без какого-либо пользовательского CSS?

Answer 1

Добавьте этот класс к вертикальному выравниванию btn-group: btn-group-vertical

Документ: http://getbootstrap.com/2.3.2/components.html

HTML:

<div class="input-append">
    <input type="text" class="input-mini" type="text">
    <span class="btn-group btn-group-vertical">
        <button class="btn">
            <i class="icon icon-chevron-up">s</i>
        </button>
        <button class="btn">
            <i class="icon icon-chevron-down">d</i>
        </button>
    </span>
</div>

И, даже если вы не хотите, чтобы css: просто исправил вид (потому что кнопки большие [больше, чем ввод)):

CSS:

.btn-group-vertical > .btn{
   height: 1em;
   padding: 0px 6px 13px;
}