CSS-两列表单是否保持正确的选项卡顺序？

我目前正在构建一个表单，用作“编辑配置文件”表单。在我的设计中，我将字段分为两列

我试图在我的表单上保持正确的标签顺序，所以如果标签通过，你将沿着左边的列，然后是右边的列。我的问题是我不能让他们按照我的意愿排好队

密码应该直接在用户名的右边，密码应该直接在公司的右边等等

请参阅随附的JSFIDLE以了解我在哪里-

有什么想法吗

---

谢谢

必须使用字段的“tabindex”属性

<INPUT tabindex="1" type="text" name="field1">
<INPUT tabindex="2" type="text" name="field2">
<INPUT tabindex="3" type="submit" name="submit">

---

尝试对右侧div使用负边距：

您需要正的底部边距，以确保div不重叠

对于第二个字段集，您需要给它一个更大的负边距，但是如果您知道div的数量，并且可以给它们一个设置的高度，那么应该不会太重要

---

请参见

感谢您的回复，很抱歉我没有提到我可能无法对标记进行控制，因为表单将动态生成。使用JS，您可以通过编程方式添加属性。

margin: -72px 0 72px;