Как выровнять центр компонента внутри вкладки TabLayoutPanel в UiBinder (GWT)?

Question

в ui.xml

<g:TabLayoutPanel barUnit='EM' barHeight='3'> 
    <g:tab> 
    <g:header size='7'><b>Income</b></g:header> 
    <g:Label>Income</g:Label> 
    </g:tab> 
    <g:tab width="100%"> 
    <g:header size='7'><b>Cost</b></g:header> 
    <g:HTMLPanel ui:field="costHTMLPanel" addStyleNames="{style.alignCenter}" /> 
    </g:tab> 

</g:TabLayoutPanel> 

myResource.css файла

.alignCenter{ 
    align:center; 
} 

Я ставлю ширину = "100%" на вкладке <g:tab width="100%">, но это не сработало.

Я также пробовал <g:HTMLPanel ui:field="costHTMLPanel" addStyleNames="{style.alignCenter}" width="100%" />, но он также не работал.

попытался также следующее, но не работал ни

<g:tab > 
    <g:header size='7'><b>Cost</b></g:header> 
    <g:HTMLPanel width="100%" addStyleNames="{style.alignCenter}"> 
     <g:HTMLPanel ui:field="costHTMLPanel" /> 
    </g:HTMLPanel> 

    </g:tab> 

OR 
......... 
    <g:HTMLPanel width="100%" > 
      <g:HTMLPanel ui:field="costHTMLPanel" addStyleNames="{style.alignCenter}"/> 
    </g:HTMLPanel> 
.......... 

OR 
<g:tab width="100%" addStyleNames="{style.alignCenter}" > 

Answer 1

Это должно быть

text-align: center; 

в файле CSS.