如何将最小宽度集中在空div上

Question

我正在尝试显示一些“对齐”文本 - 我决定使用 6 列布局，但它并不是真正的列布局，因为每行可以有一个跨越多个列的单元格（如表格中）。但是，我只使用它来做到这一点。

我的 CSS 如下所示，只要有内容它就可以工作。但是，如果没有内容，则失败。请帮忙！

.p_row { 宽度：900px; 顶部填充：0px；清除：左；}

    .p_col1 { min-width: 140px; }
    .p_col2 { min-width: 280px; }
    .p_col3 { min-width: 420px; }
    .p_col4 { min-width: 560px; }
    .p_col5 { min-width: 700px; }
    .p_col6 { min-width: 840px; }


    .labeldesc {
        display: inline-block; 
        float: left;
        text-align: left; 
        vertical-align: top; 
        margin-right: 0px; 
    }

    .field {
        display: inline;  
        float: left;
        text-align: left; 
        vertical-align: top; 
        margin-right: 0px; 
    }

样本数据：

<div class="Row Container">
    <div class="p_row">
        <div class="p_col1 labeldesc">Condition:</div>
        <div class="p_col1 field">@clinicalCondition.Description</div>
        <div class="p_col1 labeldesc">Is Chronic:</div>
        <div class="p_col1 field">@clinicalCondition.ChronicIndicatorString</div>
        <div class="p_col1 labeldesc">Date</div>
        <div class="p_col1 field">@clinicalCondition.DateString</div>
    </div>

    <div class="p_row">
        <div class="p_col1 labeldesc">Comment:</div>
        <div class="p_col5 field">@clinicalCondition.Comments</div>
    </div>
</div>   

在上面，我希望所有标签/字段对齐，但如果其中一个字段值为 string.empty，则最小宽度不起作用。如果我删除 float: left，它也不起作用。而且 display: inline-block 似乎没有做任何事情， min-width 也没有做任何事情。

任何帮助将不胜感激！我同时使用 FireFox 和 IE，但没有运气。

Answer 1

为了跟进 Shmiddty 的评论，我添加了一个 min-height: 1px; 它就像一个魅力。