html - CSSing HTML 表单布局(标签/输入的宽度相等)

Question

我正在尝试为我的 HTML 表单布局创建以下 CSS 规则:

1. 每个标签和对应的输入元素分别占宽度的50%:

|label | input |

1. 我希望能够将标签向右或向左对齐。 (输入总是左对齐。)

我注意到一件事 - 标签宽度似乎无法通过 CSS 设置？

有什么好主意吗？谢谢

Answer 1

您的标签需要 float :

label {
    float: left;
    width: 100px; /* change this to whatever you want */
    /* these make it look nicer */
    text-align: right;
    padding-right: 10px;
}

您还需要在它下面添加一些东西来清除 float ，但这应该可以解决问题。