gwt - 在 UIBinder 中居中 GWT 元素

Question

我试图将 TabLayoutPanel 居中在 uibinder 中并且没有任何运气。正如你在下面看到的，我已经尝试了我能想到的每一个 CSS 技巧。任何人都可以提供帮助吗？

<ui:style>

    .gwt-TabLayoutPanel {
        vertical-align: middle;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        border-top: 1px solid #666;
        border-left: 1px solid #999;
        border-right: 1px solid #666;

    }
</ui:style>

<g:VerticalPanel ui:field="userInterfacePanel" width="100%">
    <mapmaker:MapBox ui:field="mapBox"/>
    <g:TabLayoutPanel barHeight="20" ui:field="interfaceTabs" height="300px" width="80%" >
        <g:tab>
            <g:header>Lines</g:header>
            <g:Label>Select Line Data Here</g:Label>
        </g:tab>
        <g:tab>
            <g:header>Features</g:header>
            <g:Label>Select Features Data Here</g:Label>
        </g:tab>
        <g:tab>
            <g:header>Help</g:header>
            <g:Label>Help goes here</g:Label>
        </g:tab>
    </g:TabLayoutPanel>
    <g:HorizontalPanel>
        <g:Button>Generate KML</g:Button>
        <g:Button>Generate Shapefile</g:Button>
    </g:HorizontalPanel>
</g:VerticalPanel>

Answer 1

可以使用像这样的单元格元素来使项目居中:

<g:HorizontalPanel width="100%" height="100%">
 <g:cell horizontalAlignment="ALIGN_CENTER" verticalAlignment="ALIGN_MIDDLE">
  <g:Label>Hello Center</g:Label>
 </g:cell>
</g:HorizontalPanel>