我正在制作一个带有动画的登录表单。如果只有一个输入字段，它工作得很好，但当我添加其他输入字段时，它们彼此重叠，动画无法正常工作。“提交”按钮和复选框将隐藏。

<代码><；DIV类="；表单"；>；<；DIV类="；输入"；>；<；输入类型="；文本"；自动完成=关闭名称="；名称"；Placeholder="；"；必需>；<；标签="；名称"；类="；标签名称"；>；<；span类="；内容名称"；>；用户名<；/span>；<；/标签>；<；输入类型="；密码"；名称="；名称"；Placeholder="；"；必需>；<；标签="；名称"；类="；标签名称"；>；<；span类="；内容名称"；>；密码<；/span>；<；/标签>；<；DIV类="；隐藏"；>；<；输入类型="；复选框"；onclick="；MyFunction（）amp；quot；amp；gt；显示密码<；/DIV>；<；按钮>；登录<；/按钮>；<；/DIV>；<；/DIV>；

这里是JSFiddle：https：//jsfiddle.net/j2dteaz0/1/。

任何帮助都很感激。谢了

顺晟科技：

绝对定位需要在父元素上使用相对定位。

<代码>.输入>；迪夫{位置：相对；}.输入输入[类型=文本]，.输入输入[类型=密码]{...

编辑过的小提琴

编辑1仅

将以下CSS属性更改为this.

<代码>.窗体{位置：相对；高度：50%；宽度：50%；}