How can I change column width of panel grid in PrimeFaces

jsf primefaces
Andromida picture Andromida · May 27, 2013 · Viewed 78.6k times · Source

I am working with Java EE and PrimeFaces. How can I change the column width of a panel grid in PrimeFaces? Is there an example ?

Answer

Iván picture Iván · Apr 2, 2014

You can qualify your columns inside the panelGrid using columnClasses. The following code sets different width and stick the cells content aligned to the top-side.

<h:panelGrid columns="2" style="width: 100%" columnClasses="forty-percent top-alignment, sixty-percent top-alignment">

.forty-percent {
     width: 40%;
}

.sixty-percent {
     width: 60%;
}

.top-alignment {
     vertical-align: top;
}

Related questions

Understanding PrimeFaces process/update and JSF f:ajax execute/render attributes

What exactly are process and update in PrimeFaces p:commandXxx components and execute and render in f:ajax tag? Which works at the time of validation? What does update attribute do rather than updating value to component from back end? …

Read More
List of <p:ajax> events

I've searched the Internet and I cannot find a list of <p:ajax> events. Can anyone provide a complete list of events for the <p:ajax> tag? I'm particularly interested if there is an onblur event …

Read More
Primefaces valueChangeListener or <p:ajax listener not firing for p:selectOneMenu

I am using Primefaces 3.4.2. I have the following in my JSF page <p:selectOneMenu id="emp" value="#{mymb.emp.employeeName}" valueChangeListener="#{mymb.handleChange}" required="true" style="width: 150px;"> <f:selectItem noSelectionOption="true" itemLabel="Please Select"/> <…

Read More