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 ，但这应该可以解决问题。