组插件在引导表中占用太多空间(Group addon taking up too much space in bootstrap table)
当我将一个.group-addon到bootstrap .table一个元素上时,所有其他元素都没有足够的空间,并且group-addon输入占用太多空间。
<h2>Only one bully, group-addon</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> <div class="input-group-addon">x</div> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <h2>Two bullying group-addons</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <div class="input-group-addon">x</div> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> <div class="input-group-addon">x</div> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <h2>No Bullies</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <div class="alert alert-info">When there is no group-addon inside a table with class table, the spacing looks reasonable, but a single group-addon ruins it all</div>http://jsfiddle.net/billymoon/ntm2q/
我应该如何在引导表中使用group-addons而不占用太多空间?
When I add a .group-addon to an element inside a bootstrap .table, all other elements are not given enough space, and the group-addon input takes up far too much room.
<h2>Only one bully, group-addon</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> <div class="input-group-addon">x</div> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <h2>Two bullying group-addons</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <div class="input-group-addon">x</div> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> <div class="input-group-addon">x</div> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <h2>No Bullies</h2> <table class="table"> <tbody> <tr> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td> <div class="input-group"> <input id="cool" class="form-control"> </div> </td> <td>pushed around...</td> <td>being bullied...</td> <td>by group addons...</td> </tr> </tbody> </table> <div class="alert alert-info">When there is no group-addon inside a table with class table, the spacing looks reasonable, but a single group-addon ruins it all</div>http://jsfiddle.net/billymoon/ntm2q/
How should I use group-addons inside bootstrap tables without them taking too much space?
最满意答案
尽量少用/ CSS:
.input-group-addon { width:auto; }Try in your Less / CSS:
.input-group-addon { width:auto; }更多推荐
group-addon,class,table,电脑培训,计算机培训,IT培训"/> <meta name="descr
发布评论