Telerik RadGrid Filtertemplate作为RadCombobox UI不合适

Question

我正在使用Telerik RadGrid控件，我在其中添加了FilterTemplate作为RadComboBox，用于为特定列提供过滤器，但RadComboBox看起来不合适。

PFA获取RadComboBox的屏幕截图。

代码：

<telerik:RadGrid ID="RadGridApplications" Skin="Metro" SkinID="Metro" AutoGenerateColumns="false"
OnNeedDataSource="RadGridApplications_NeedDataSource" AllowPaging="true" PageSize="10" 
ShowStatusBar="true" AllowFilteringByColumn="true" runat="server">
    <MasterTableView DataKeyNames="ProductID">
        <Columns>
            <telerik:GridBoundColumn DataField="ProductID" HeaderText="Application ID" HeaderStyle-Width="10%" AllowFiltering="false">
            </telerik:GridBoundColumn>

            <telerik:GridBoundColumn DataField="Name" HeaderText="Application Name" HeaderStyle-Width="65%" AllowFiltering="false">
            </telerik:GridBoundColumn>

            <telerik:GridBoundColumn DataField="Status" HeaderText="Status" HeaderStyle-Width="15%" FilterControlAltText="Status" ReadOnly="true">
                <FilterTemplate>
                    <telerik:RadComboBox ID="Status_filter" runat="server" Height="200px" Width="100%" 
                    AppendDataBoundItems="true" OnClientSelectedIndexChanged="selectedindexchanged" 
                    SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Status").CurrentFilterValue %>'>
                        <Items>
                            <telerik:RadComboBoxItem Text="Active" Value="Active"/>
                            <telerik:RadComboBoxItem Text="In-Active" Value="In-Active" ViewStateMode="enabled" />
                        </Items>
                    </telerik:RadComboBox>

                    <telerik:RadScriptBlock ID="radscriptblock1" runat="server">
                        <script type="text/javascript">
                            function selectedindexchanged(sender, args) {
                                var tableview = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                            tableview.filter("status", args.get_item().get_value(), "equalto");
                            }  
                        </script>
                    </telerik:RadScriptBlock>

                </FilterTemplate>
            </telerik:GridBoundColumn>

            <telerik:GridHyperLinkColumn Text="Edit" ItemStyle-CssClass="editlink" DataNavigateUrlFields="ProductID" HeaderStyle-Width="10%"
            DataNavigateUrlFormatString="AddEditApplication.aspx?Mode=Edit&ID={0}" AllowFiltering="false">
            </telerik:GridHyperLinkColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

Answer 1

看起来有些CSS会覆盖RadComboBox的默认设置。检查浏览器开发工具栏中呈现的HTML，找到打破它的规则，以便在需要时覆盖它们。

或者，从页面中删除所有自定义CSS，如果问题消失了 - 开始逐个添加。

这适用于我的代码（我只添加了一个虚拟数据源，删除了其他列并对页面进行了调整）：

和