文本框比其列大100％，

Question

现在我看到的问题是，表格只是根据窗口的大小和其中的数据而增长和缩小，除了这个输入框。它想要大于列本身。该列没有大小设置限制，输入的宽度为100％，但是由于某种原因，它希望为110％的宽度，因此看来。 100％始终是基于外部的，因此设置时仅应基于特定的px填充和边框。有人可以告诉我为什么以及我该怎么做吗？

我为您知道表讨厌者，您想开始告诉我如何用不同的方式对此进行编码，但是我喜欢它们，并且它们仍然比CSS显示更好地工作：表，表行，表单元。

.inputWidth {
    width: 100%;
}
.textInput {
    border: 5px solid white;
    -webkit-box-shadow: inset 0 0 8px rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0 0 8px rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
    box-shadow: inset 0 0 8px rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
    padding: 5px;
    background: hsl(120, 100%, 80%);
}

Answer 1

这看起来像一个盒子大小的问题。我会尝试将box-sizing: border-box;添加到输入中。拥有width: 100%;

时，这会考虑填充和边框