Align elements inside h:panelGrid without CSS

Question

I've got a rich:dataTable with h:panelGrid inside it. Inside panel grid I've got 2 elements: text and checkbox. What I need is to align text to the left side and checkbox to the right side.

Here is my code:

<rich:dataTable styleClass="richTableStyle" var="gi" 
        value="#{processNotifySelector.getAllApplicants()}" width="100%" id="SMSTable">

        <rich:column style="text-align:center">

            <f:facet name="header">
                <h:panelGrid columns="3">
                    <h:outputText value="Уведомлять заявителя по SMS" />
                    <a4j:commandButton value="Выбрать все"
                        disabled = "#{processNotifySelector.multipleApplicants}"
                        action="#{processNotifySelector.setBatchEnabled(true)}"
                        render="SMSTable" />
                    <a4j:commandButton value="Ab все"
                        disabled = "#{processNotifySelector.multipleApplicants}"
                        action="#{processNotifySelector.setBatchEnabled(false)}"
                        render="SMSTable" />
                </h:panelGrid>
            </f:facet>


            <h:panelGrid columns="2">
                <s:div>

                    <h:panelGrid columns="1" style="text-align:left">
                        <s:div>
                            <h:outputText value="#{gi.getObject().toString(activeWorkItemController.activityCreateDate)}" />
                        </s:div>

                        <s:div>
                            <h:outputText value="&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;(Не указан номер мобильного телефона)" rendered = "#{empty gi.person.cellPhone and empty gi.agent.phone}" style ="font-size: 10px"/>
                        </s:div>
                    </h:panelGrid>

                </s:div>

                <s:div>
                    <h:panelGrid columns = "1" style="text-align:right">
                    <h:selectBooleanCheckbox  value="#{gi.shouldNotified}" rendered = "#{not empty gi.person.cellPhone or not empty gi.agent.phone}">
                        <a4j:ajax event="change"></a4j:ajax>
                    </h:selectBooleanCheckbox>      
                    </h:panelGrid>              
                </s:div>
            </h:panelGrid>  
        </rich:column>  
</rich:dataTable>

I tried to add style = "text-align:right/left" for panelGroups inside panelGrid, the same style for div's - no effect. How can I solve my problem? Thanks.

Answer 1

The solution is quite simple. I added to panelGrid property style="width:100%; text-align: right". And left text-align:left/right on panelGroups.