Html 使输入框的宽度和高度相对于外部分区的宽度和高度为100%_Html_Css

Html 使输入框的宽度和高度相对于外部分区的宽度和高度为100%

html css

Html 使输入框的宽度和高度相对于外部分区的宽度和高度为100%,html,css,Html,Css,我不知道在这里该怎么办我想将我的div的宽度限制为200px，并使输入框在div内具有100%的宽度和高度。现在，它似乎超出了div框的宽度。以下是问题的快速图片（IE10）：以下是标记： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body>

我不知道在这里该怎么办

我想将我的div的宽度限制为200px，并使输入框在div内具有100%的宽度和高度。现在，它似乎超出了div框的宽度。以下是问题的快速图片（IE10）：

以下是标记：

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

</head>

<body>

<div style="border:1px solid red; height: 20px; width: 200px;">

<input style="background: yellow; height: 100%; width: 100%; border: 0;" type="text">

</div>

</body>

</html>

您可以添加

溢出：隐藏

上查看此
框大小：边框框
问题？输入{padding:1px}
在我的浏览器中默认设置。将填充：0
添加到
将解决此问题。正如@Paulie_D所说，额外的填充会导致宽度增加，因为在默认模式下。