bootstrap3.02：table-responsive在手机上不工作，但是在firefox下工作答案

【问题标题】：bootstrap3.02: table-responsive doesn't work in mobile phone, but works in firefoxbootstrap3.02：table-responsive在手机上不工作，但是在firefox下工作
【发布时间】：2014-01-31 02:58:33
【问题描述】：

bootstrap3.02：table-responsive 不能在手机上使用，但是可以在 Firefox 中使用。代码如下：

    <div class="table-responsive">
        <table id="table12" class="table" >
            <tr><td>my god </td><td>my god </td><td>my god </td><td>my god </td><td>my god </td><td>my god </td></tr>
            <tr><td>my god </td><td>my god </td><td>my god </td><td>my god </td><td>my god </td><td>my god </td></tr>
        </table>     
    </div>

如果pc电脑的firefox浏览器窗口足够小，表格底部会出现滚动条。但是如果手机的uc浏览器窗口足够小，表格底部就不会出现滚动条。在手机360浏览器中，我可以通过移动手指滚动表格，但滚动条仍然没有出现。为什么？谢谢！

【问题讨论】：

是浏览器的兼容性问题。滚动条将出现在手机的 chrome 浏览器中。我的上帝。

标签： html css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

您可以使用您自己的 html 页面中的 mediaQuery 来覆盖“.table-responsive”类 <style> @media (max-width:'**strong text**yourmaxpixel'px) { .table-responsive { width: 100%; margin-bottom: 15px; overflow-x: scroll; overflow-y: hidden; border: 1px solid #ddd; -ms-overflow-style: -ms-autohiding-scrollbar; -webkit-overflow-scrolling: touch; } } </style>

【讨论】：