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; 

嘗試