我正在使用RichFaces 4.3.6。我有一个由dataGrid和dataTable组成的dataGrid
如何与顶部内部dataGrid和dataTable对齐?
vertical-align:top不起作用。
我还希望将dataGrid中包含的图像居中。它们垂直居中但不是水平的。我怎样才能做到这一点 ?
Here a picture to show what I want
<rich:panel>
<rich:dataGrid value="#{isb.bloc.groups}" var="group" columns="#{isb.bloc.groupsSize}" styleClass="data-grid" >
<rich:dataGrid value="#{group.items}" var="item" columns="#{group.colNumber}" elements="#{group.itemsSize}" styleClass="data-grid">
<f:facet name="header">
<h:outputText value="#{group.name}" class="facet-datagrid"></h:outputText>
</f:facet>
<rich:panel>
<h:graphicImage value="/img/#{item.image.id}/#{item.image.type}" width="#{item.image.width}" height="#{item.image.height}" class="image" />
</rich:panel>
</rich:dataGrid>
<h:dataTable value="#{group.remarks}" var="rem" styleClass="data-table">
<h:column>
<f:facet name="header">
<h:outputText class="left block" value="#{msg['details']}"></h:outputText>
</f:facet>
<h:outputText class="left block" value="#{rem.detail}"></h:outputText>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText class="right block" value="#{msg['delays']}"></h:outputText>
</f:facet>
<h:outputText class="right block" value="#{rem.delay}"></h:outputText>
</h:column>
</h:dataTable>
</rich:dataGrid>
</rich:panel>
.data-table{
width: 100%;
vertical-align: top;
}
.data-grid{
width: 100%;
vertical-align: top;
}
.image{
padding: 10px;
}