Question

It may sound a silly question but I’ve tried everything: with style attribute (display: inline), with styleClass attribute but nothing.
I want this code to be displayed on the same line/row:

<p:panel rendered="#{not empty enastrSearch.recordsList}">
                <p:dataTable id="tableData" var="record" value="#{enastrSearch.recordsList}" style="border: 0px" >
                    <p:column>
                        <p:dataGrid var="column" value="#{record.renderColumnList}" columns="4" style="display: inline">
                            <p:column>
                                #{column.columnValue}
                            </p:column>
                        </p:dataGrid>
                        <h:selectOneMenu value="#{options.selectedBank}" style="display: inline" >
                            <f:selectItems value="#{banks.currentBanks}"  />
                        </h:selectOneMenu>
                    </p:column>
                </p:dataTable>
            </p:panel>

Thank you!

Answer 1

Either add the following to your CSS:

#tableData .ui-datagrid { 
    float: left;
}

Or if that doesn’t achieve the desired layout (the items will collapse together without whitespace, you’d need to manipulate the whitespace yourself inside the datagrid’s column content), then put them in a <h:panelGrid columns="2"> instead:

<h:panelGrid columns="2">
    <p:dataGrid ... />
    <h:selectOneMenu ... />
</h:panelGrid>