0

我写了以下css

 .rightCheckBoxes {
      float: right;
      width: 139px;
      margin: 4px 3px 2px 3px;
 }



 <div class="clearfix">
    <g:HTML addStyleNames="{style.formLabel}" ui:field="accountHTMLLabel">A<u>c</u>count</g:HTML>
    <fa:FocusAwareSuggestBox maxLength="20" addStyleNames="{style.formField} {style.accountWidth}" ui:field="accountSuggestBox"/>
    <g:Button addStyleNames="{style.normalButtons} {style.rightAlignment} {style.rightFieldAdjust}" enabled="false" ui:field="allocationButton">Bu<u>tto</u>n</g:Button>
    <g:CheckBox addStyleNames="{style.rightCheckBoxes}" checked="true" ui:field="allocationCompleteCB">Allocation Complete</g:CheckBox>
</div>

当我将其更改为以下内容时：

 .rightCheckBoxes {
      float: right;
      width: 139px;
      margin: 4px 3px 2px 3px;
 }

 <!-- Added this -->
.rightCheckBoxWidth {
      width:142px !important;            
 }  
 <!-- -->

<div class="clearfix">
    <g:HTML addStyleNames="{style.formLabel}" ui:field="accountHTMLLabel">T<u>i</u>tle</g:HTML>
    <fa:FocusAwareSuggestBox maxLength="20" addStyleNames="{style.formField} {style.accountWidth}" ui:field="acctSuggestBox"/>
    <g:Button addStyleNames="{style.normalButtons} {style.rightAlignment} {style.rightFieldAdjust}" enabled="false" ui:field="button1">Bu<u>tto</u>n</g:Button>
    <g:CheckBox addStyleNames="{style.rightCheckBoxes} {style.rightCheckBoxWidth}" checked="true" ui:field="chk2">Status Complete</g:CheckBox>
</div>

并单击firebug选项以查看元素“chk2”，它向我显示了来自standard.css的gwt复选框元素的默认样式，而不是在上面选择我自己的样式。为什么这是我无法理解的逻辑！

4

0 回答 0