Question

我有静态（当在较低的屏幕上滚动它停留在同一个地方时），在Bootstrap的响应表中固定大小的第一列（100px）。我想要的是让其他列相同大小（剩余空间：100％-100px）与最小宽度css（所以当它降低响应开始工作）。而且我不知道我将拥有多少非静态列，因此col-md / xs ..不合适。

在 photo有日期应该共享剩余空间，但仅限于最小宽度，例如80px。如果低，那么响应应该工作。无论如何，我想制定时间表。

代码来源：

create table #criteria 
(propertyId int, searchvalue nvarchar(20))


insert into #criteria (propertyId, searchvalue)
select  
    cc.propertyId,
    c.value('@value','nvarchar(20)')  
from #properties cc
cross apply @criteria.nodes(N'/criteria/property[@id=sql:column("PropertyID")]/item') t(c)

SELECT ArticleID, count(1)
FROM ArticlesProperties ap
join #criteria cc on  cc.propertyId = ap.propertyId and cc.searchvalue = ap.value
group by ArticleID 
having count(1) = (select count(distinct propertyid from #criteria))

还有一件事。我不想在td中发短信来翻过表边框。所以它应该适应td的大小。

Answer 1

你看过这个（伟大的）相关的问题和答案吗？

Bootstrap - how to set up fixed width for <td>?

<tr class="something">
    <td class="col-md-2">A</td>
    <td class="col-md-3">B</td>
    <td class="col-md-6">C</td>
    <td class="col-md-1">D</td>
</tr>

Answer 2

我想通过添加：

来解决这个问题

@media 
only screen and (max-width: 767px),
(min-device-width: 768px) and (max-device-width: 1024px)  {
    .table-responsive > .table > tbody > tr > td {
        white-space: inherit;
        min-width:200px;
    }
 }

Tnx任何人都可以寻求帮助。

Bootstrap响应表列大小

2 个答案: