html–calc是否与display：table-cell一起使用？

我有一个结构,div设置为显示像表元素.这是一个输入表单,我希望左列(字段标签所在的位置)为50％宽,加上2 em,因此星号可以适合所需的字段,右列(字段所在的位置)可以占用剩下的空间.

我尝试使用calc来设置宽度.但至少在我最新的Chrome中,列会获得一些任意宽度,即使检查元素显示规则存在且处于活动状态.可能是什么问题呢？ calc与display不兼容：table-cell？或者我在某个地方犯了错误？

这是HTML

和它的CSS

.dialog-label-column,.nested-label-column {    wIDth: calc(50% + 2em);}.dialog-fIEld-column,.nested-fIEld-column {    wIDth: calc(50% - 2em);}.entryRow {    overflow: hIDden;    display: table-row;    wIDth: 100%;}div.mock-td {    display: table-cell;    vertical-align: top;    padding-bottom: 0.7em;}div.mock-table {    display: table;}

http://jsfiddle.net/H28gT/

在浏览器窗口宽度我显示它,左列是130px宽,右列是371px,所以显然不是我想要的几乎50％宽度.

table{   /*this keeps your columns with fixed with exactly the right wIDth*/   table-layout:fixed;}