How to fix width and height of a p:dialog

In my web application i want to fix height and width of a PrimeFaces p:dialog in the way in which the开发者_如何学运维 dialog appears exactly in the middle of my web page, and if one want to minimize the window then the dialog should also be minimized.

I mean middle of my one of the frame not whole window. For example dynamic sized dialog like % width and height.

You can use following code to make it of fixed dimension:

<p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" width="300" height="200">  
    <h:outputText value="This is a Modal Dialog." />  
</p:dialog>    

and to make minimize functionality. You can play with JavaScript to get it done.

See Also

• PrimeFaces Showcase

Try this, use a attribute style (or styleClass):

<p:dialog ... modal="true" style="width:50% !important; height:40% !important; top:25% !important; left: 30% !important;">
  <!-- any components -->
</p:dialog>

See more here.

You can use following code to make it of fixed dimension,

<p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" width="300" height="200">  
    <h:outputText value="This is a Modal Dialog." />  
</p:dialog>

and to make minimize functionality. you can play with javascript to get it done.

If you are using p-dialog, then you will want to use the built-in styleClass attribute.

.my-style-class {
    width: 50%;
    height: 70%;
}

<p-dialog styleClass="my-style-class"><p-dialog>