没有计算的输入元素保证金，但是指标下的保证金（和显示）

Question

我在表格单元格下面有一个输入元素，如下所示：

<td><input class="form-control input-small my-input-narrow" type="number"></td>

不幸的是，这个单元格确定的列宽度比输入元素的宽度宽得多。

当我在Chrome中检查元素时，计算出的样式标签显示：

margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;

但是，当我使用指标，并查看视觉效果，并将鼠标悬停在保证金上时，它会显示一个宽广的区域作为边距，尽管表面上写着“ - ”作为边距的宽度。 td的计算样式显示宽度为219px（而输入元素本身为33px）。

您对我有什么建议可以更好地了解渲染的原因吗？

谢谢！

Answer 1

当所有样式将填充设置为0px时，我遇到了类似的问题，填充显示在视觉上。在这种情况下，“ - ”仍显示在度量标准区域中。问题是外部元件被设置为固定宽度，因此填充物用于填充被检查元件和具有固定宽度的外部元件之间的间隙。

如果您正在检查Chrome开发者工具中的元素，并在度量标准区域显示“ - ”时注意填充或边距，则很可能就是这种情况。