我正在努力重构我们的表单控制器之一，以便我们可以将它用于面向公众的站点。目前它正在为表单生成表格布局，但我正在尝试使用CSS表单完成它。
我试图重现一些看起来像这样的东西 http://www.stylephreak.com/uploads/source/cssforms/cssform.php
我遇到的问题是我找到的每个CSS表单示例似乎都假定左列标签的固定宽度。在我的案例中，我无法控制标签中的内容，它来自用户可编辑的翻译库。使用表格非常简单，我只需使用空格：nowrap;并且最长的标签将决定td的宽度，每个人都很高兴。
可以用CSS做类似的事情吗？我尝试过使用min-width并强制它不要换行。这有效，但只是推动当前控制权并搞砸对齐，更不用说IE 6中不支持最小宽度。
使用表格进行表单布局真的很糟糕吗？这是表格数据并且在线性化之后有意义吗？
你可以设置 <label> css to display: table-cell 和含有 <div> 至 display: table-row。这将模仿使用表而不实际使用a的行为 <table>。
<div style="display: table-row">
<label style="display: table-cell; padding: 0 1em; text-align: right;" for="fm-firstname">First Name:</label>
<input type="text" name="fm-firstname" id="fm-firstname" />
</div>
<div style="display: table-row">
<label style="display: table-cell; padding: 0 1em; text-align: right;" for="fm-lastname">Last:</label>
<input type="text" name="fm-lastname" id="fm-lastname" />
</div>
这在任何最近的浏览器（Firefox，Chrome，IE8 +）中看起来都很棒。在IE7中，文本框将无法正确对齐。
好吧，这是一个有点不同寻常的解决方案，但我认为简单应该适用于所有浏览器。
可访问性似乎不是一个问题，因为键盘和鼠标控制都充当了问题。当然，主要的缺点是如果关闭CSS，此页面将无法很好地呈现。有关于那个地方的统计数据吗？而且我也不知道屏幕阅读器将如何对这种肆意做出反应。
对我的知识 forms总是占据可用宽度的100％。你可以用它。
如果允许填充此表单提供的容器的整个宽度，那么这似乎是一个有效的答案：
在这种情况下的一个小缺点是选择标签宽度和输入之间的比率。