css - UI の変更により、firebug は元のスタイルではなく standard.css を選択するようになりました

Question

私は次の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チェックボックス要素のデフォルトスタイルが表示されます.なぜこれは論理的に理解できないのですか!