Gxt combo box selection arrow is not properly aligned in GXT4.0

I have upgraded the GXT from 3.0 to 4.0 and combox box arrow is showing like in the image

It works fine in GXT3.0.It is dispalyed fine in GWT Debug mode also in GXT4.0.

I had created Combo Box exactly with the following link. http://examples.sencha.com/gxt/4.0.0/#ExamplePlace:comboboxstyled

**I am using gray theme.** 

gxt-all.css file

The following Css I have applied to combo box but I am not sure it is applying or not.

.x-combo-list {
    border-color:#98c0f4;
    background-color:#ddecfe;
    font:normal 12px tahoma, arial, helvetica, sans-serif;
}

.x-combo-list-inner {
    background-color:#fff;
}

.x-combo-list-hd {
    font:bold 11px tahoma, arial, helvetica, sans-serif;
    color:#15428b;
    background-image: url(../images/default/layout/panel-title-light-bg.gif);
    border-bottom-color:#98c0f4;
}

.x-resizable-pinned .x-combo-list-inner {
    border-bottom-color:#98c0f4;
}

.x-combo-list-item {
    border-color:#fff;
}

.x-combo-list .x-combo-selected{
    border-color:#a3bae9 !important;
    background-color:#dfe8f6;
}

.x-combo-list .x-toolbar {
    border-top-color:#98c0f4;
}

.x-combo-list-small {
    font:normal 11px tahoma, arial, helvetica, sans-serif;
}

/////////////////////////////////////////////////////////////////

**CustomComboBoxView.css file**

@eval borderColor com.sencha.gxt.core.client.resources.ThemeStyles.get().borderColor();

.view {
  background-color: white;
  border: 1px solid borderColor;
  -moz-outline: none;
  outline: 0 none;
  position: relative;
}

@if (is("ie6"))  {
  .view {
    overflow: auto; 
  }
} @else {
  .view {
    overflow-y: auto; 
  }
}

.item {
   border: 1px solid #FFFFFF;
    font-family: tahoma, arial, helvetica, sans-serif;
    font-size: 12px;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: normal;
    overflow: auto;
    padding: 2px;
    white-space: normal;
    cursor: pointer;
}

.over {
  gwt-image: 'selectedBackground';
  height: auto;
  border: 1px dotted #DDDDDD !important;
  cursor: pointer;
}

.sel {
  background: none repeat scroll 0 50% #DFE8F6;
  border: 1px dotted #A3BAE9 !important;
  cursor: pointer;
}

////////////////////////////////////////////////////

EntryPointSample Class file

      public interface CustomListViewResources extends
        ListViewDefaultResources {

             @Override
            @Source({"com/test/sample/clients/gwt/client/panel/CustomComboBoxView.css"})
          CustomListViewStyle css();

         }

         interface CustomListViewStyle extends
         ListViewDefaultAppearance.ListViewDefaultStyle { }


        private final SampleProperties sampleProperties = GWT.create(SampleProperties.class);
        private ComboBox<Sample> SampleComboBox;


        final ListViewDefaultResources resources = GWT.create(CustomListViewResources.class);


        final ListViewDefaultAppearance<Sample> appearance = new ListViewDefaultAppearance<Sample>(resources);

        final ListView<Sample, String> listView =
                        new ListView<Sample, String>(sampleLocationListStore, sampleProperties.name(),
                        appearance);

        sampleComboBox =
                        new ComboBox<Sample>(sampleLocationListStore, sampleProperties.nameLabel(), listView);
        sampleComboBox.setWidth(150);
        sampleComboBox.setTypeAhead(true);

        sampleComboBox.setTriggerAction(ComboBoxCell.TriggerAction.ALL);

        sampleComboBox.addSelectionHandler(new SelectionHandler<Sample>() {
            @Override
            public void onSelection(SelectionEvent<Sample> companySelectionEvent) {


              }
            });

        testDropdownLabel = new FieldLabel(sampleComboBox, constants.labelTest());
        testDropdownLabel.setLabelWidth(50);
        widget.add(testDropdownLabel);

链接地址: http://www.djcxy.com/p/64416.html

上一篇: 什么是幻数，为什么它不好？

下一篇: 在GXT4.0中，Gxt组合框选择箭头未正确对齐