Question

我会使用你的建议如何摆脱那桌挤压。

 <div class="container">
        <table id="table" class="table table-hover" name="table">
            <tr>
                <td class="col-md-1">20.09.2015</td>
                <td class="col-md-1"><a href="#" style="text-decoration:none;"><span class="label label-default label-as-badge" style="font-weight:normal;">category</span></a></td>
                <td class="col-md-5"><a id="test" name="test" href="#">41423</a></td>
                <td class="col-md-5">1123</td>
            </tr>
        </table>
 </div>

我想要完成的是两个左侧的日期，类别总是相同的，小的，不可挤压的。并且标题和内容开头的两个右侧标识应该更不一样。

现在，如果我拖动浏览器的右侧，它应该缩小所有可能的内容，如果没有剩余空间，则从右侧切割（elippsing或smth）到左侧。

这可能吗？提前谢谢！

Answer 1

要在窗口缩小时保持td（或任何元素）不被包装，请使用white-space: nowrap作为样式。这将确保行仅在<br>元素处断开。

请参阅official documentation at W3C。

Bootstrap表td挤压问题

1 个答案: