This content has been marked as final.
Show 2 replies
-
1. Re: How to set Width on rich:columns
shadowcreeper Jul 6, 2012 9:53 PM (in response to tvictor)I assume you have tried <rich:datatable columnClasses="col1style,col2style,..."> ?
The columns may have similar attributes. Generally I try to modify table layouts by adding styles or classes using "width:XXpx;" or "width:XX%;" rather than table's width attribute (same goes for alignment, borders, padding, margin, etc).
-
2. Re: How to set Width on rich:columns
tvictor Jul 12, 2012 11:04 AM (in response to shadowcreeper)My issue was that the column header was not wrapping, even though I set a width. To fix this issue, I had to modify cssclasses,
.rich-table-subheadercell
{
white-space: normal !important;
}
.rich-table-sortable-header
{
white-space: normal !important;
}
Then set the width on rich:columns and on the control. as shown below.
<rich:columns value="#{imDashboardList.columnSelector.visibleColumns}" var="_theColumn" id="#{ e:concat(_theColumn, '_col')}" sortBy="#{invoiceTask[1][_theColumn]}" sortOrder="#{imDashboardList.sortOrder[_theColumn]}" styleClass="rich-table-cell-noborder grayAble rich-table-sortable-header" headerClass="rich-table-sortable-header" index="columnsIndex" style="width:#{imDashboardList.columnSelector.getColumnWidth(_theColumn)}px;"> <f:facet name="header"> <h:outputText value="#{imDashboardList.columnSelector.getFromCamelCase(_theColumn)}" /> </f:facet> <h:outputText style="width:#{imDashboardList.columnSelector.getColumnWidth(_theColumn)}px;" id="#{_theColumn}" value="#{ValueTranslator.getDisplayString(invoiceTask[1], _theColumn, invoiceTask[1][_theColumn])}" /> </rich:columns>