Question

使用以下HTML，输入元素的宽度超出了表边框的边缘。使输入元素占据整个单元格内容的正确方法是什么，但是在右边缘上仍然具有与左边显示的相同的边距？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<body>
<table style="border: 1px solid #000000;" width="100%">
<tr>
<td><input style="width:100%"/></td>
</tr>
</table>
</body>
</html>

Answer 1

原因是评估输入宽度时不考虑输入本身的默认边界（可能是填充，IIRC）。尝试设置padding: 0px; border: 0px并进行检查。

另外，请参阅 Problem with <input type='text' /> and <textarea> width 或How can I make a TextArea 100% width without overflowing when padding is present in CSS?寻求解决方案 - 之前已经提出过。

文本输入元素的边框超出了包含表格

1 个答案: