【发布时间】：2017-05-14 11:41:08
【问题描述】：
我在 rails webapp 上有一个现有的 ruby，我使用 Bootstrap 3 使其完全响应并满足其他样式要求。现在我的一些网页包含数据表。由于我的 web 应用程序是完全响应的，所以当我在移动设备中打开我的 web 应用程序时，数据表会适合小屏幕，并且底部会出现一个水平滚动条。 但我不需要这个功能。我需要整个表格以较小的字体可见且没有水平滚动条。
有没有办法使用媒体查询和任何其他技巧来实现这一点？
请帮我解决这个问题。
提前致谢！！！
我的数据表如下：
<table class="table table-striped table-hover" id="indentdatesort">
<thead>
<tr>
<th>Indent No.</th>
<th>Warehouse</th>
<th>Item</th>
<th>Make/Catno</th>
<th>UOM</th>
<th>Qty</th>
<th>Qty P</th>
<th>Sh Cl</th>
<th>Date</th>
<th>SortDate</th>
<th>Rqt Dt</th>
<th>Sort Rqt Dt</th>
<th>Cost Centre</th>
<th>Remarks</th>
<th>By</th>
<th>Entry</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>INDMSF/16-17/00002</td>
<td>Furnace</td>
<td>Cotton Hand Gloves</td>
<td></td>
<td>pair</td>
<td>12.0</td>
<td>0.0</td>
<td></td>
<td>25/06/16</td>
<td>06/25/16</td>
<td>25/06/16</td>
<td>06/25/16</td>
<td>Kiln . Kiln 1 . Girth Gear</td>
<td></td>
<td>Ashfaque</td>
<td>Ayush Jhunjhunwala</td>
<td><input class="btn btn-default btn-xs" name="154" type="submit" value=">" /></td>
</tr>
<tr>
<td>INDMSF/16-17/00003</td>
<td>Furnace</td>
<td>Bearing 22317 EW33J</td>
<td></td>
<td>no</td>
<td>2.0</td>
<td>2.0</td>
<td></td>
<td>31/08/16</td>
<td>08/31/16</td>
<td>31/08/16</td>
<td>08/31/16</td>
<td></td>
<td></td>
<td>Ashfaque</td>
<td>Ayush Jhunjhunwala</td>
<td><input class="btn btn-default btn-xs" name="155" type="submit" value=">" /></td>
</tr>
</tbody>
</table>
我的实际看法是：
我的手机视图是：-
看，在移动视图中，出现了一个水平滚动条。我不需要这个滚动条，我想看到所有表格列都适合小屏幕，可能是小字体。
【问题讨论】：
-
请添加 HTML 版本...这里不是 ruby 编码器。
-
如果可以的话可以分享一下问题的截图吗？还要检查与 dataTable 响应 css 文件（responsive.bootstrap.css）和引导支持的“dataTables.bootstrap.css”相关的文件到您的文件目录中。
标签： html ruby-on-rails twitter-bootstrap-3 responsive-design datatables