GWT - 与Horizo​​ntalPanel的InternetExplorer用户界面问题

Question

在我的GWT应用程序中，我有一个按钮面板，实现为HorizontalPanel，其中包含Button包装在<g:cell>元素中的小部件。

<g:HorizontalPanel styleName="{style.horizontalPanel}"> 
    <g:cell> 
    <g:Button ui:field="selectButton" title="{constants.buttonLabel}" 
        text="{constants.actionLabelSelect}" /> 
    </g:cell> 
    ... 
</g:HorizontalPanel> 

按钮具有以下CSS：

.gwt-Button { 
    font-size: 13px; 
    color: #337BB1; 
    margin: 0px 10px; 
    padding: 5px 7px; 
    border: 1px solid #E3E3E3;  
    } 

按钮标签通常有两个词。与所有非IE浏览器相比，按钮面板不适合布局。每个按钮看起来太宽，某个按钮仅部分显示。而且，即使我调整了视图的大小（Ctrl + "-"），仍然如此，因为包含按钮的整个面板都被调整大小。所有FF和Chrome的行为如下：如果面板不适合浏览器窗口，则按钮标签是分行的，并且默认情况下，按钮的尺寸要小得多，以便它适合标准浏览器大小。

为什么IE的行为不同？

调试的另一个问题是，在GWT的superDevMode和devMode中，问题也不会发生在IE中。

这怎么可能？

浏览器版本：IE8， GWT版本2.5.1

Answer 1

尝试用CSS min-width Property

.gwt-Button { 
    ... 
    min-width: 135px; 
} 

你可以用CSS overflow Property也

overflow: visible; 

尝试