Css 为什么我的输入没有对齐？

我需要一些帮助。 我是css新手，所以我不知道为什么我的输入“textarea”不能与其他输入垂直对齐？ 右边多1或2倍

这是我的JSFIDLE：

---

Chrome的用户代理样式表（也称为浏览器的“默认CSS样式”）为textarea指定了2px的边距。由于您只声明了

margin-top

属性，因此剩余的三个边距仍然设置为2px，您可以从检查器中看到这一点（通过右键单击文本区域并选择

Inspect-element

来访问）

---

要使其与其余部分对齐，只需将

margin top:30px

替换为

margin:30px 0

，您就可以完成设置。

我发现问题在于文本区域的边框不够宽，而不是提交按钮不够宽，而是文本区域的额外宽度

在设置站点样式时，请记住长方体模型

这是一把更新过的小提琴，如果我把它弄得太乱了，我很抱歉，我只是想让它更简单一些：

尝试将窗体的背景设置为红色，这样您现在可以看到的所有内容都是窗体的宽度（我认为这正是您试图做的）

有几件事：

我删除了表格以外的所有内容，以便您可以轻松阅读

需要注意的一条规则是

框大小：边框框-它通常会为您计算在元素上设置的填充，因此，如果您有宽度为200px的内容，并将填充设置为10px，那么它将变为220px，因为您将所有边的填充设置为10px。根据这条规则，它将知道从初始宽度上减去20px，以使其适合您实际设置的宽度

我用/>关闭了您的输入，因为jsfiddle让我这么做，您不必这么做

使用
placeholder=“”
而不是
value=“”
-如何设置占位符的样式：

在这些情况下，您真的不应该使用height，对于textarea，正如您所做的那样，我添加了一个
resize:vertical
以确保它不能脱离表单元素

希望这有帮助
 你有一个
页边距上限：30px设置为
textarea
。将其更改为
页边距顶部：4px对不起，我不是很具体，我是说垂直对齐，“文本区域”更多的是1或2px到右侧。。。
form{
 width:255px;
 height:266px;
 margin: 0 auto;
 margin-top:200px;
}


input[type=text]{
  font-family:verdana;
  width:250px;
  height:40px;
  padding-left:5px; 
  background-color:rgba(255,255,255,0.95);
  border-style:none;
}

textarea{
  font-family:verdana;
  margin-top:30px;
  max-width:250px;
  min-width:250px;
  min-height:100px;
  max-height:200px;
  background-color:rgba(255,255,255,0.95);
  border-style:solid;
  border-color:rgba(215, 40, 40, 0.9);
 }

input[type=submit]{
  margin-top:-3px;
  width:250px;
  height:40px;
  color:white;
  background-color:rgba(215, 40, 40, 0.9);
  border-style:none;
  }