Могу ли я складывать поля и другие элементы с помощью Bootstrap 3?

Question

Можно ли складывать поля, похожие на Button groups - Vertical variation, желательно с помощью комбинации полей и кнопок, чтобы все элементы, казалось, были соединены вместе?

Это, насколько я получил:

<div class="form-group btn-group-vertical" > 
    <label for="id_address_finder" class="control-label">Input Label</label> 
    <div class="controls"> 
     <input class="textinput textInput form-control" type="text" /> 
    </div> 
    <button type="button" class="btn btn-primary btn-block">Button Text</button> 
</div> 

Кнопка появляется на «присоединиться» в поле выше, так как ajoining углы не округляются, но тот же эффект не применяется к полю.

Answer 1

Это, кажется, работает хорошо ...

Fiddle

Нам нужно удалить border-radius и border-top из текстовых полей и прокручиваемым так, что они будут выглядеть равномерной и не двойной вверх на границы.

<style> 
    .grp-btn { 
     border-radius: 0; 
     border-top: 0; 
    } 
</style> 

<div class="btn-group-vertical" role="group" aria-label="..."> 
    <button type="button" class="btn btn-default">Button</button> 
    <button type="button" class="btn btn-default">Button</button> 
    <input type="text" name="fname" class="form-control grp-btn" placeholder="first name..."> 
    <input type="text" name="lname" class="form-control grp-btn" placeholder="last name..."> 
    <textarea class="form-control grp-btn" placeholder="comments..."></textarea> 
    <button type="button" class="btn btn-primary">Submit</button> 
</div>