ComboBox的DropDown按钮远离输入框

时间:2012-06-01 06:31:47

标签: asp.net ajaxcontroltoolkit

我正在使用AjaxControlToolkit的ComboBox控件。 DropDown箭头显示距离实际位置相当远。看到这张图片:

enter image description here

如何修复此问题以使其看起来像理想的DropDownList?

如果图片未显示,请点击此链接:http://postimage.org/image/99yqullkb/

****编辑(CSS代码)****

.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input
{
    margin: 0;
    padding: 0px 0px 1px 0px;
    border: solid 1px #7F9DB9;
    border-right: 0px none;
    font-size: 13px;
    height: 18px;
    width:200px;
}
.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
    padding: 0px 0px 10px 0px;
    height: 21px;
    width: 21px;
}
.WindowsStyle .ajax__combobox_itemlist
{
    border-color: #7F9DB9;
}

2 个答案:

答案 0 :(得分:3)

看起来像CSS样式的副作用。使用FireBug或Developer Tools等工具检查箭头按钮及其容器的计算样式。 IAE尝试应用下面的样式规则,也许它可以解决问题:

table.ajax__combobox_inputcontainer td
{
    padding: 0 !important;
    text-align: left !important;
}
table.ajax__combobox_inputcontainer td.ajax__combobox_buttoncontainer button
{
    margin-left: 0 !important;
}

答案 1 :(得分:0)

如果您使用宽度属性(如width =“20%”),则会出现此问题。避免在width属性中使用“%”,并尝试使用像width =“200px”那样的精确宽度。