Html 当p标签被添加到同级div的底部时，为什么我的div被按下？

在表单元素中有两个div并排放置。通常情况下，它们都在表单顶部对齐

但是，当我将p标记（类遗忘）添加到第二个同级div的底部时，第一个div将从表单的顶部向下推。第二个div紧靠表单元素的顶部

我不明白为什么第二个同级div底部的p标记在第一个div的顶部添加边距/填充

一个线索是设置

vertical align:top

可以解决这个问题，但我想知道是什么导致了这个问题

表单{
颜色：白色；
宽度：430px；
高度：80px；
浮动：对；
边框：1px纯黑；
}
.formEmail，
.formPassword{
边框：1px纯白；
宽度：165px；
身高：100%；
字体大小：13px；
右边距：10px；
显示：内联块；
}

电子邮件或电话

密码

忘记账户

只需添加

溢出：隐藏到divs


表单{
颜色：白色；
宽度：430px；
高度：80px；
浮动：对；
边框：1px纯黑；
}
.formEmail，
.formPassword{
边框：1px纯白；
宽度：165px；
身高：100%；
字体大小：13px；
右边距：10px；
显示：内联块；
溢出：隐藏；
}

电子邮件或电话

密码

忘记账户
您需要将
垂直对齐：top
添加到两个div中：我想在重置中它们被设置为基线或中间（如果您使用其中一个）。
我会更改并说
基线
是默认值，因此在这种情况下，左对齐变得奇怪。。。尽管如此+1@LGSon是基线是默认值，但也取决于是否使用重置。我见过一些使用垂直对齐：中间的重置