css - Bootstrap 响应 TableView 缺少表边框

Question

我在 Firefox 浏览器的数据 TableView 中遇到了一个奇怪的问题。

<div class="table-responsive">
    <table class="table table-striped table-bordered" id="viewData">
        <thead>
            <tr>
                <th class="text-left tbl-head" align="left"></th>
                <th class="text-left tbl-head" align="left">people Name</th>
                <th class="text-left tbl-head" align="left">Email</th>
                <th class="text-left tbl-head" align="left">City</th>
                <th class="text-left tbl-head" align="left">Country</th>
                <th class="text-left tbl-head" align="left"> Time</th>
                <th class="text-left tbl-head" align="left">Subject</th>
                <th class="text-left tbl-head" align="left">Message</th>
                <th class="text-left tbl-head" align="left">Status</th>
                <th class="text-left tbl-head" align="left">Reply</th>
            </tr>
        </thead>
        <tbody id="dataView">
            <tr id="631" class="tbl-bg-color">
                <td class="text-left" align="left"><input  type="checkbox"></td>
                <td class="text-left" align="left">shamim</td>
                <td class="text-left" align="left">xyz@gmail.com</td>
                <td class="text-left" align="left">washington</td>
                <td class="text-left" align="left">usa</td>
                <td class="text-left" align="left">18-Mar-15</td>
                <td class="text-left" align="left">hi</td>
                <td class="text-left" align="left">hi</td>
                <td class="text-left" align="left">UnReplied</td>
                <td class="text-left" align="left"><button class="btn-primary btn btn-bg">Reply</button></td>
            </tr>
            <tr id="619" class="tbl-bg-color">
                <td class="text-left" align="left"><input  type="checkbox"></td>
                <td class="text-left" align="left">test</td>
                <td class="text-left" align="left">test@yahoo.co</td>
                <td class="text-left" align="left">washington</td>
                <td class="text-left" align="left">usa</td>
                <td class="text-left" align="left">15-Mar-15</td>
                <td class="text-left" align="left">123123</td>
                <td class="text-left" align="left">123123</td>
                <td class="text-left" align="left">Replied</td>
                <td class="text-left" align="left"><button class="btn-primary btn btn-bg">Reply</button></td>
            </tr>
            <tr id="596"  class="tbl-bg-color">
                <td class="text-left" align="left"><input  type="checkbox"></td>
                <td class="text-left" align="left">monir</td>
                <td class="text-left" align="left">vvv@yahoo.com</td>
                <td class="text-left" align="left">india</td>
                <td class="text-left" align="left">-</td>
                <td class="text-left" align="left">06-Mar-15</td>
                <td class="text-left" align="left">test</td>
                <td class="text-left" align="left">hii...test</td>
                <td class="text-left" align="left">Replied</td>
                <td class="text-left" align="left"><button class="btn-primary btn btn-bg">Reply</button></td>
            </tr>
            <tr id="594" class="tbl-bg-color">
                <td class="text-left" align="left"><input  type="checkbox"></td>
                <td class="text-left" align="left">t mob</td>
                <td class="text-left" align="left">t@y.com</td>
                <td class="text-left" align="left">washington</td>
                <td class="text-left" align="left">-</td>
                <td class="text-left" align="left">06-Mar-15</td>
                <td class="text-left" align="left">hi</td>
                <td class="text-left" align="left">hi bb</td>
                <td class="text-left" align="left">UnReplied</td>
                <td class="text-left" align="left"><button class="btn-primary btn btn-bg">Reply</button></td>
            </tr>
        </tbody>
    </table>
</div>

我已经粘贴了我的代码。在这里，当我放大我的 Firefox 浏览器时，它缺少一些边框线。当我查看 80% 的分辨率时，我发现电子邮件列的右边框丢失了。

Firefox浏览器bootstrap的问题是什么？在其他浏览器中，我没有遇到问题。

Answer 1

从其他答案中，确保您的缩放级别为 100%，否则 firefox 会在尝试折叠边框时遇到问题。

Ctrl + 0 将重置您的缩放比例。

响应式网站更多的是关于减小浏览器窗口的大小而不是缩放级别。