css - 左对齐表单标签，输入也左对齐

Question

所以我正在尝试创建一个带有标签的漂亮表单。目的是让所有标签与输入内联，同时保持左对齐。因为我也想让输入左对齐，所以每个标签和输入之间的空间是不同的。

如有任何帮助，我们将不胜感激。一如既往的感谢，非常感谢。

Answer 1

将标签的宽度设置为相同，所有输入都将对齐

label {
    display: inline-block; //So that we can set the width
    width: 40px; //Whatever the widest label will be.
}

如果您添加更长的标签，这可能会导致一些问题，您可能需要调整宽度以使其不会溢出。