设置dataTable中所有列的宽度答案

【问题标题】：Setting width of all columns in dataTable设置dataTable中所有列的宽度
【发布时间】：2012-07-18 21:35:05
【问题描述】：

我在使用 JSF2.0 的 JSF 页面中使用 dataTable 以表格格式显示数据。下面是我的代码。

<h:dataTable id="patentBudgetList" var="patentBudgetList" value="#{PersonalInformationDataBean.budgetInfoList}"  border="1" width="40%">
    <h:column>
        <f:facet name="header">
            <h:outputText value="Description" />
        </f:facet>
        <h:outputText value="#{patentBudgetList.budgetTitle}"/>  
    </h:column>
    <h:column>
        <f:facet name="header">
            <h:outputText value="Cost" />
        </f:facet>
        <h:outputText value="#{patentBudgetList.budgetCost}"/>
    </h:column>
</h:dataTable>

我想要的是将Description 列的宽度设置为80%，并将Cost 列的宽度设置为20%。

知道如何完成这项工作吗？

【问题讨论】：

stackoverflow.com/questions/5112151/…的可能重复
你能发布你的数据表选项吗？
@Ravi ：你怎么能说它重复？该链接对我有什么帮助？？
@RicardoLohmann ：哪个选项？我粘贴了我拥有的 dataTable 代码...
可以利用 columnClasses 来设置每一列的样式

标签： html jsf-2 datatable column-width

【解决方案1】：

下面是我的做法……

<h:dataTable id="patentBudgetList" var="patentBudgetList" 
 value="#{PersonalInformationDataBean.budgetInfoList}"  
 border="1" width="40%"
 columnClasses="setWidthOfFirstColumn,setWidthOfSecondColumn"
>
    <h:column>
        <f:facet name="header">
            <h:outputText value="Description" />
        </f:facet>
        <h:outputText value="#{patentBudgetList.budgetTitle}"/>  
    </h:column>
    <h:column>
        <f:facet name="header">
            <h:outputText value="Cost" />
        </f:facet>
        <h:outputText value="#{patentBudgetList.budgetCost}"/>
    </h:column>
</h:dataTable>

在css中我有

.setWidthOfFirstColumn {
    width: 80%;
}

.setWidthOfSecondColumn {
    width: 20%;
}

【讨论】：