GWT - проблема пользовательского интерфейса InternetExplorer с HorizontalPanel

0

В моем приложении 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

Теги:
internet-explorer
gwt
cross-browser

1 ответ

0

Попробуйте использовать свойство min-width CSS.

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

вы можете попробовать с использованием переполнения CSS.

overflow: visible;

Ещё вопросы

Сообщество Overcoder
Наверх
Меню