Component Location :
Primefaces has some components that have a position attribute, such as p:dialog :
<p:dialog header="Header Text" widgetVar="dialog" position="10,50"> ... </p:dialog>
In the example, the position is specified as a pair [x, y] associated with the upper left corner of the browser window. Values such as “top,” “bottom,” “left,” “right,” or “center” are also allowed here. If the attribute is omitted, the dialog position is centered.
For all other components, css positioning can be used either using the style attribute or styleClass , which is available for a large number of Primefaces components or defined in a separate CSS layout.
The following example sets the absolute position for p:dataTable :
<p:dataTable value="#{testBean.selectOptions}" var="item" style="position:absolute; top:50px; left:240px;">
The rulers even have their own p:layout tag, which can also be used for positioning.
Style
This can be done using the "General" topics . In addition, the documentation for the main sections (you need to pay from version 2.1) lists all CSS style classes for each component. You can tailor them to suit your needs.