Css 在Bootstrap 3中，如何使表与网格相一致？

引导表不尊重网格，即使它们定义了col-xs-X类

下面是一个显示（红色）表格如何与（灰色）网格不对齐的最小示例：

.col-xs-1{
背景色：#eee；
边框：1px实心#999；
}
th{
背景颜色：#费用；
边框：1px纯红；
}

Colcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcol
5列标题
三列标题
4列标题

引导CSS向所有

列xx

元素添加

右填充：15px

和

左填充：15px

移除或覆盖填充物，物体应正确对齐。下图显示了删除填充时引导层中发生的情况。

一种重写方法是创建一个名为

no padding

的类，如下所示：

.no-padding {
     padding-left: 0;
     padding-right: 0;
}

并将其应用于不希望应用填充的任何元素。下面是一个更新的演示，显示了以下内容：

.col-xs-1{
背景色：#eee；
边框：1px实心#999；
}
th{
背景颜色：#费用；
边框：1px纯红；
}
1.没有填充物{
左侧填充：0！重要；
右边填充：0！重要；
}

Colcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcolcol
5列标题
三列标题
4列标题

您能提供您的代码的MCV示例吗？（1） 在bootstrap中无法解决这个问题，您需要通过添加自己的CSS规则来解决这个问题，因为CSS规则不能像bootstrap网格那样工作（就像浮动一样）。（2） 我不确定我是否理解这一点，这就是为什么我希望看到MCV Annnd完全重写这个问题，因为现在我有一个简单的例子，没有必要讨论我的站点特定的东西：）它适用于表，但现在表中不存在的任何东西都与列的边缘齐平。（参见“col”以及它们如何接触盒子边缘）。我想，当包含表的两列相邻时，我必须在它们之间放置一个空列。所以我可以对所有栏目都这样做。将网格的边距设置为0，并使用空列水平分隔内容。（实际上，我正在自定义引导以使用24列，因此这比听起来更节省空间。）我来试一试！您可以创建一个没有填充的新类，并将其仅应用于您的表，更新了我的答案以包含JSFIDLE，显示了这一点，非常棒，谢谢！现在我有一个新的但高度相关的问题：）这个问题的答案和这个差不多，它是应用于嵌套行的相同填充。我不这么认为。如果我删除列中的所有填充，我似乎也会遇到同样的问题。问题是我的页面有12列宽。让我们将其中一列的宽度称为x。如果我制作一个10倍宽的列，并将其细分为嵌套行中的5/12和7/12，我得到的奇怪大小与任何整数x都不对应。4.167x和5.833x。除非我误解了如何在Boostrap中完全嵌套行（非常可能！）