Почему SmartGWT переопределяет мой CSS?

Мне поручено разработать виджет с кнопками в SmartGWT (предприятие). Дизайн требует границ вокруг кнопок. Я разработал CSS для этого. Однако SmartGWT настаивает на переопределении моего определения границ CSS, заполняя атрибут "style" в сгенерированном TD. Документы для Canvas.setBorder на самом деле говорят: "Это свойство применяет одну и ту же границу ко всем четырем сторонам этого компонента. Различные границы для каждой стороны могут быть установлены в стиле CSS и применены через styleName ". Понятно, что он предназначен для управления определениями границ с помощью CSS.

Я понимаю, что мог бы просто вызвать setBorder с определением конкретной границы, но мне нужно иметь разные границы в зависимости от состояния (зависание, вниз и т. Д.)

Например, ярлык кнопки "Обзор". Вот сгенерированный HTML:

<td class="controlButton" style="border: currentColor; border-image: none; text-align: center; padding-top: 0px; padding-bottom: 0px; vertical-align: middle;">
    <div style="vertical-align: middle; display: inline-block; white-space: nowrap; max-width: 100%;">
        <div id="isc_1G" overflow: hidden; vertical-align: middle; display: inline-block; -ms-text-overflow: ellipsis; max-width: 100%; box-sizing: border-box;">Review</div></div></td>

В моем CSS у меня есть класс (controlButton), определенный с рамкой, но явное объявление границы в "стиле" переопределяет его.

Вот код, где я создаю кнопку:

Button button = new Button(“Review”);
button.setBaseStyle(“controlButton”);
button.setBorder("inherit");
button.setHeight(28);

Я также пытался не вызывать setBorder, вызывать setBorder(null) и, как указано выше, setBorder("наследовать"). Ничто не влияет на встроенный стиль.

Вот CSS (без краткости все определения состояний):

.controlButton {
    background-color: #353535;
    text-align: center;
    font-size: 14px;
    vertical-align: middle;
    padding: 2px;
    margin: 2px;
    border-radius: 5px;
    border: 1px solid #b9b9b9;
    color: #d5d5d5;
}

В режиме программирования браузера я могу вручную отменить определение границы в "встроенном стиле", и моя кнопка выглядит правильно, используя мой класс CSS.

Между прочим, я понимаю, что могу использовать модификатор! Important в CSS, но должен быть способ заставить SmartGWT перестать переопределять без него.

Версия SmartGWT - 4.0.5. Версия GWT - 2.7.0.

0 ответов

Другие вопросы по тегам