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

Question

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

任何帮助，将不胜感激。一如既往地感谢，非常感谢。

Answer 1

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

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

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