PF11 Splitter does not work with datatable scrollable or resizable

[Netinium]

PrimeFaces version 11.0.8

using the following xhtml only the first row works using the splitter:

Code: Select all

<div>
    <div class="card">
        <h4>Splitter with dataTable no resizing or scrolling</h4>
        <p>This works</p>
        <p:splitter>
            <p:splitterPanel>
                <div class="card">
                    <p:dataTable lazy="true">
                        <p:column headerText="col 1"/>
                        <p:column headerText="col 2"/>
                        <p:column headerText="col 3"/>
                    </p:dataTable>
                </div>
            </p:splitterPanel>
            <p:splitterPanel>
                <div class="card">
                    some card
                </div>
            </p:splitterPanel>
        </p:splitter>
    </div>
    
    <div class="card">
        <h4>Splitter with dataTable resizableColumns true</h4>
        <p>This does not work</p>
        <p:splitter>
            <p:splitterPanel>
                <div class="card">
                    <p:dataTable resizableColumns="true" lazy="true">
                        <p:column headerText="col 1"/>
                        <p:column headerText="col 2"/>
                        <p:column headerText="col 3"/>
                    </p:dataTable>
                </div>
            </p:splitterPanel>
            <p:splitterPanel>
                <div class="card">
                    some card
                </div>
            </p:splitterPanel>
        </p:splitter>
    </div>
    
    <div class="card">
        <h4>Splitter with scrollable dataTable</h4>
        <p>This does not work</p>
        <p:splitter>
            <p:splitterPanel>
                <div class="card">
                    <p:dataTable scrollable="true" lazy="true">
                        <p:column headerText="col 1"/>
                        <p:column headerText="col 2"/>
                        <p:column headerText="col 3"/>
                    </p:dataTable>
                </div>
            </p:splitterPanel>
            <p:splitterPanel>
                <div class="card">
                    some card
                </div>
            </p:splitterPanel>
        </p:splitter>
    </div>
</div>

but the 2nd and 3r rows fail to use the splitter because the resizableColumns is used or the scrollable datatable is used.
Is there a way to fix this?

Example:

https://drive.google.com/file/d/1rppg-E ... sp=sharing

Best regards,
Martijn