Problem with Primefaces table header width

I have a table with several columns, some of whose headers or contents can be a bit longer. I don't want the content to be cut off or wrapped, I just want the whole table to be wider. I achieve this behavior with the setting tableStyle="width:auto". This displays the body of the table the way I want it. However, this breaks the headers.

How can I get the headers to be displayed to match the body?

Here my code for the datatable:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns=";
      xmlns:h=";
      xmlns:p=";>

<h:head>
    <title>PrimeFaces Scrollable Table</title>
</h:head>

<h:body>
    <h:form>
        <div class="scrollable-table">
            <p:dataTable var="item" value="#{bean.data}" rows="10" scrollable="true" tableStyle="width:auto"  resizableColumns="true">
                <p:column headerText="ID">
                    <h:outputText value="#{item.id}" />
                </p:column>
                <p:column headerText="Name" sortBy="#{item.description}" filterBy="#{item.name}">
                    <h:outputText value="#{item.name}" />
                </p:column>
                <p:column headerText="Beschreibung">
                    <h:outputText value="#{item.description}" />
                </p:column>
                <p:column headerText="kurz">
                    <h:outputText value="#{item.description}" />
                </p:column>
                <p:column headerText="Beschreibung die schon länger ist" sortBy="#{item.description}" filterBy="#{item.description}">
                    <h:outputText value="#{item.description}" />
                </p:column>
                <p:column headerText="kurz">
                    <h:outputText value="#{item.description} aber das ist schon sehr ziemlich lang" />
                </p:column>
                <p:column headerText="länger ist eher länger">
                    <h:outputText value="#{item.id}" />
                </p:column>
                <p:column headerText="k">
                    <h:outputText value="k" />
                </p:column>
                <p:column headerText="Beschreibung">
                    <h:outputText value="#{item.description} mega ultra lang, damit wir eine sehr lange Spalte haben!" />
                </p:column>
                <p:column headerText="kurz">
                    <h:outputText value="kurz" />
                </p:column>
            </p:dataTable>
        </div>
    </h:form>
</h:body>

</html>

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

Problem with Primefaces table header width - Stack Overflow

与本文相关的文章

评论列表(0)