1

我想修复我的数据表的宽度。

我正在使用<p:dataTable> </p:dataTable>PrimeFaces 3.2。

如何使用 css 修复 PrimeFace 的 DataTable 宽度？

我已经试过了

style="table-layout: fixed; width:100px;"

但它不起作用

添加DataTable的完整代码

 <p:dataTable id="eventTbl" var="e" value="#{eventBean.eventList}" style="table-layout: fixed; width:100px;"
    paginator="true" rows="20" lazy="true"
    paginatorTemplate=" {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
    dynamic="true">
    <p:column>
        <p:commandButton id="selectButton" update=":form:display"
            action="#{eventBean.getEventDetails(e.eventNum)}"
            oncomplete="eventDialog.show()" icon="ui-icon-search"
            title="View">
        </p:commandButton>
    </p:column>
    <p:column headerText="Event Type" filterBy="#{e.eventType}">
        <h:outputText value="#{e.eventType}" />
    </p:column>
    <p:column headerText="Order Id" filterBy="#{e.orderId}">
        <h:outputText value="#{e.orderId}" />
    </p:column>
    <p:column headerText="Status" filterBy="#{tr.status}">
        <h:outputText value="#{tr.status}" />
    </p:column>
    <p:column headerText="Event Date" filterBy="#{e.eventDate}">
        <h:outputText value="#{e.eventDate}" />
    </p:column>
    <p:column headerText="Event Number" filterBy="#{e.eventNum}">
        <h:outputText value="#{e.eventNum}" />
    </p:column>
    <p:column headerText="Request Number" filterBy="#{e.requestNum}">
        <h:outputText value="#{e.requestNum}" />
    </p:column>
    <p:column headerText="Masked Pan" filterBy="#{e.maskedPan}">
        <h:outputText value="#{e.maskedPan}" />
    </p:column>
    <p:column headerText="Card Name" filterBy="#{e.cardName}">
        <h:outputText value="#{e.cardName}" />
    </p:column>
    <p:column headerText="Reference Number" filterBy="#{e.refNumb}">
        <h:outputText value="#{e.refNumb}" />
    </p:column>
</p:dataTable>
4

3 回答 3

1

使用 tableStyle 而不是样式。

于 2013-02-19T09:33:41.267 回答
0

我很确定您在输入和按钮表单元素的样式类上有一些最小宽度或宽度属性。

使用 firebug 进行检查（选择其中一个输入字段并检查附加到它的样式以获取 min-width 或 width 属性）。

如果您有其中任何一个，请尝试删除或调整它们的大小，因为它们的宽度将被应用，无论您为它们的父（表格）元素设置的宽度是多少。

问候马克

于 2013-02-19T09:19:05.710 回答
0

可能有两种可能的方法来解决或找到这个问题。

  1. 请检查您是否已将 colspan 大小用于数据表。例如，如果您的表单 colspan 大小为 10，请确保您在数据表中提到 colspan 大小为 10。
  2. 使用 styleClass 而不是 style 或继承值，如下所示

.tableSize{ table-layout:fixed !important; width:100% !important; }

使用 styleClass="tableSize"

于 2017-08-21T06:01:58.003 回答