Space 在 Bootstrap Table 和滚动条之间

Question

我有一个响应式 bootstrap table，即使您不需要滚动，我也想显示滚动条。但是，table 底部和 scrollbar.See jsfiddle 之间有一个很大的 space：https://jsfiddle.net/er1187/dmgx7db6/

我尝试在 table 中不添加 margin/padding 但这行不通。提前致谢！

.table-responsive{
     overflow-x:scroll;
     margin: 0 !important; 
     padding-bottom: 0 !important;
}

Answer 1

尝试重新排序您的代码。试试这个

<div class="box-content box-no-padding">
        <div class="table-responsive">
            <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th class="text-center">First Name</th>
                            <th class="text-center">Last Name</th>
                            <th class="text-center">ID</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>John</td>
                            <td>Smith</td>
                            <td>1187</td>
                        </tr>
                    </tbody>
                </table>
            <div class="scrollable-area">

            </div>
        </div>
    </div>

Space 在 Bootstrap Table 和滚动条之间

Space between Bootstrap Table and Scrollbar

scrollbar

bootstrap-table

responsive