显示验证标签时表单中标签元素上的 CSS 错误

Question

当我单击发送按钮并显示红色验证消息时，表单左侧的标签(例如“姓名 添加您的姓名”)似乎移动了位置。

表格可以在这里找到:

http://www.bestclownintown.co.uk/book.php

这是标签的 CSS 规则，第二条规则是错误消息。有没有办法修改这些 CSS 规则或其他元素的规则，以确保单击“发送”时，左侧显示黑色标签，右侧显示红色验证标签。

#stylized label {
display: block;
font-weight: bold;
text-align: left;
width: 140px;
float: left;
}

label.error {  
color: red; 
padding-left: .5em; 
vertical-align: top; 
}

Answer 1

进行以下更改。

• 将表单的宽度从 500 像素更改为 900 像素，以适应标签、输入和错误消息。
• 添加清除:两者；到左侧标签。
• 删除错误消息的 padding-left。
• 在错误消息中添加 height:40px。

所有样式都在 style.css 中定义。因此，检查用于上述更改的类，并在该文件中进行所需的更改。

如果有任何问题，请告诉我。