使用：nth-​​child（）和多个类

Question

我正在尝试了解第n个子选择器。

使用下面的代码我想我会得到一个3个等宽（95px）的div的“表”，第一个有5px右边的填充，第二个有两个填充左边右边2.5px，最后有左边填充5px

第二个“表”将有两个div，第一个具有195px宽度，右边填充为5px，最后一个9px宽度为5px填充。

不幸的是，第二个“表”的最后一个div似乎左右填充了2.5px。

负责此事的规则：

  

div.table-td.w33：第n个孩子（2）

但是在该组中只有一个同时具有table-td和w33类的div，所以不应该有第二个孩子（nth-child（2））

div.table {
  width: 300px;
	background-color: black;
}

div.table-td {
	display: inline-block;
	vertical-align: top;
	padding-right: 5px;
	padding-left: 5px;
	background-color: grey;
}

div.table-td:first-child {
	padding-left: 0;
}

div.table-td:last-child {
    padding-right: 0 !important;
}

div.table-td.w33 {
	width: 33%;
	width: calc((100% / 3) - 5px);
}

div.table-td.w33:nth-child(2) {
	padding-right: 2.5px;
	padding-left: 2.5px;
}

div.table-td.w66 {
	width: 66%;
	width: calc(((100% / 3) * 2 ) - 5px);
}

<div class="table">
<div class="table-td w33">Should take 95px width with padding right of 5px</div>
<div class="table-td w33">Should take 95px width with padding right and left of 2.5px</div>
<div class="table-td w33">Should take 95px width with padding left of 5 px</div>
</div>

<div class="table">
<div class="table-td w66">Should take 195px width with padding right of 5px</div>
<div class="table-td w33">Should take 95px width with padding left of 5 px</div>
</div>

有人可以启发我吗？我的想法中的错误在哪里，或者这个错误的浏览器渲染？