webshim HTML5验证气泡未正确显示

我已经创建了一个HTML5表单，其中包含自定义错误消息和通过webshim进行的验证，该表单大部分工作正常，显示正确，但是气泡没有显示在复选框下方，默认显示在页面的左上角。我不确定我的CSS是否正在抛出气泡，或者它是否试图在我没有显示的元素下显示

这是我的标记（结构有点不寻常，因为我需要在两个单独的表单下显示submit按钮）：

步骤1

名称
电子邮件
电话
艺术品类型（即雕塑、绘画等）
艺术家姓名（如已知）
工件名称（如已知）
测量
日期/年龄（如已知）
条件
文件（证书、收据、以前的评估等）
文字/标签（文字或艺术品上的任何文字或标签）
采购历史记录（日期、成本、地点等）
其他详细信息（您知道的任何其他信息）
评估类型
保险
捐赠
一般产业规划
步骤2

请上传你作品的各个方面的图片



或者拖放

条款与条件：乌特康格精英康茂德酒店。我们是精英。猫咪休止符euismod rhoncus felis，我是mauris posuere vitae。大白鲨，无需临时直径。在我们的道路上，不存在任何障碍。免费的大众饮食。他是一位智者，他是一位智者。尼西苏打水悬浮液。奥古斯·萨皮恩的莫尔比。ultricies公司、vulputate公司、turpis公司、nec Laoret quam velit非nunc公司。在阿利奎姆利伯罗，在阿利奎特里索斯，一个泰勒斯康莫多。Fusce finibus a nulla et facilisis。

演示：

任何帮助都将不胜感激

试试这个：

input[type="checkbox"] {
    /* display: none; */
    visibility: hidden;
    margin-right: -15px;
}

---

当你把display none放进去时，他们找不到复选框的当前位置

啊，是的，当然！这就是当我回到几个月前写的CSS时发生的事情。非常感谢！我选择了

opacity:0；位置：绝对位置；左：20px，这使得系统复选框不会占用任何空间，同时气泡会准确显示。
input[type="checkbox"] {
    /* display: none; */
    visibility: hidden;
    margin-right: -15px;
}