Группа ввода TwitterBootstrap и поле ввода в теге td
У меня есть таблица, и для одного из столбцов я хочу, чтобы каждая строка в этом столбце содержала поле ввода, а рядом с полем ввода - значок со знаком плюс. ниже код у меня есть
<td data-rowis-yellow=false data-parent='email'>
<input type='text' placeholder='Email' value='{{this.attributes.email}}' title='{{this.attributes.email}}'>
<span class="badge"><span class="glyphicon glyphicon-plus"></span></span>
</td>
однако это создает поле ввода в одну строку, а значок значка находится под текстовым полем. Я хочу, чтобы значок значка находился справа от текстового поля. есть идеи как этого добиться?
Вот как выглядит весь шаблон
<table class="table">
<thead>
{{#each headers}}
<th>{{this}}</th>
{{/each}}
</thead>
<tbody>
{{#each all_rows}}
{{#if this.attributes.isMaster}}
<tr data-row-type='final' style="background-color: green;">
{{else}}
<tr data-row-type='staged' style="background-color: grey;">
{{/if}}
<td data-parent='not-conflict'>
{{#if_eq this.attributes.isMaster false}}
<input type='checkbox'>
{{/if_eq}}
</td>
<td data-rowis-yellow=false data-parent='firstname'><input type='text' placeholder='First' value='{{this.attributes.firstname}}' title='{{this.attributes.firstname}}'></td>
<td data-rowis-yellow=false data-parent='lastname'><input type='text' placeholder='Last' value='{{this.attributes.lastname}}' title='{{this.attributes.lastname}}'></td>
<td data-rowis-yellow=false data-parent='businessname'><input type='text' placeholder='Buisines' value='{{this.attributes.businessname}}' title='{{this.attributes.businessname}}'></td>
<td data-rowis-yellow=false data-parent='email'>
<input type='text' placeholder='Email' value='{{this.attributes.email}}' title='{{this.attributes.email}}'>
{{#if_eq this.attributes.isMaster false}}
<span class="badge hover-add" data-funct="AddExtraField"><span class="glyphicon glyphicon-plus"></span></span>
{{/if_eq}}
</td>
<td data-rowis-yellow=false data-parent='address'><input type='text' placeholder='Address' value='{{this.attributes.address}}' title='{{this.attributes.address}}'></td>
<td data-rowis-yellow=false data-parent='country'><input type='text' placeholder='Country' value='{{this.attributes.country}}' title='{{this.attributes.country}}'></td>
<td data-rowis-yellow=false data-parent='phones'>
{{#each this.attributes.phones}}
<input type='text' value='{{this}}' title='{{this}}'>
{{#if_eq ../this.attributes.isMaster false}}
<span class="badge hover-add" data-funct="AddExtraField"><span class="glyphicon glyphicon-plus"></span></span>
{{/if_eq}}
{{else}}
<input type='text' placeholder='Phone' value=''>
{{/each}}
</td>
<td data-rowis-yellow=false data-parent='twitters'>
{{#each this.attributes.twitters}}
<input type='text' value='{{this}}' title='{{this}}'>
{{#if_eq ../this.attributes.isMaster false}}
<span class="badge hover-add" data-funct="AddExtraField"><span class="glyphicon glyphicon-plus"></span></span>
{{/if_eq}}
{{else}}
<input type='text' placeholder='Twitter' value=''>
{{/each}}
</td>
<td data-rowis-yellow=false data-parent='linkedin'><input type='text' placeholder='LinkedIn' value='{{this.attributes.linkedin}}' title='{{this.attributes.linkedin}}'></td>
<td data-rowis-yellow=false data-parent='urls'>
{{#each this.attributes.urls}}
<input type='text' value='{{this}}' title='{{this}}'>
{{#if_eq ../this.attributes.isMaster false}}
<span class="badge hover-add" data-funct="AddExtraField"><span class="glyphicon glyphicon-plus"></span></span>
{{/if_eq}}
{{else}}
<input type='text' placeholder='Url' value=''>
{{/each}}
</td>
</tr>
{{/each}}
</tbody>
</table>
Из того, что я могу сказать, кажется, что столбец не становится достаточно большим, чтобы поместиться в поле ввода и значок рядом друг с другом. Единственный способ, которым я могу получить их в одной строке, это вложить их в систему сетки начальной загрузки, но это просто кладет 2 элемента друг на друга.
<td data-rowis-yellow=false data-parent='email'>
<div class="row">
<div class='col-md-6>
<input type='text' placeholder='Email' value='{{this.attributes.email}}' title='{{this.attributes.email}}'>
</div>
<div class='col-md-6'>
<span class="badge"><span class="glyphicon glyphicon-plus"></span></span>
</div>
</div>
</td>