为什么:: after psuedo-element在Chrome输入框中显示为复选框输入而不显示文本输入？

Question

我有以下代码段。如果输入的CSS类“已更改”，我想在单元格的左上角绘制一个红色三角形。

它适用于复选框，但不适用于文本输入。当我检查Chrome中的元素时，复选框的伪元素的尺寸为0 x 0，而文本输入的尺寸为auto x auto，因此浏览器处理这些元素的方式显然存在一些差异，但是我不知道。

如何更改此设置，以使两者都相同？造成差异的机制是什么？一个或另一个是否具有一些我可以覆盖的隐式属性？我对我是否应该使用它（我已经读过this answer）不感兴趣。

我正在使用Chrome v75.0.3770.100。

td {
  position: relative;
  border: 1px solid black;
}
td input {
  margin-left: 10px;
}
td .changed::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 3px;
    border-left-color: #c00000;
    border-top-color: #c00000;
}

<table>
  <tr>
    <td><input type="checkbox" class="changed"/></td>
    <td><input type="text" class="changed"/></td>
  </tr>
</table>