RadComboBox limited width

[Antoine]

Hi,

I'm using a RadComboBox but I'm having some problems when the width is more than 1000 pixels. (see capture)

Does anyone knows how to fix that ? Or should I limit the RadComboBox width to 1000 pixels ?

Thanks.

[Vessy]

Hello Antoine,

Can you, please, share configuration of the RadComboBox leading to the result shown on the attached image? Below you can see the result i got with the following setup:

        <telerik:RadComboBox ID="RadCombobox1" runat="server" Width="1100px">
            <Items>
                <telerik:RadComboBoxItem Text="Item1" Value="Item1" />
                <telerik:RadComboBoxItem Text="Item2" Value="Item2" />
                <telerik:RadComboBoxItem Text="Item3" Value="Item3" />
            </Items>
        </telerik:RadComboBox>

Regards,
Vessy
Progress Telerik

[Antoine]

Here is the comboxbox integration :

What I think so far, is that the combobox background is an image (see capture below) and this image got a max-width of 1000px. Can you confirm that ?

 

Also, I've tried to set a width in pixels and not in percent. Got the same issue...

[Vessy]

Hi,

Thank you for the additional details, Antoine. Your assumption is correct - it seems that you are using the ComboBox in Classic render mode, which uses background sprite with limited size. Basically, there are two possible ways to fix the faced problem:

1. Switch to Lightweight render mode which uses CSS3 for the control backgrounds, but not sprites:
   https://docs.telerik.com/devtools/aspnet-ajax/general-information/controlling-visual-appearance/render-modes#setting-render-mode
   
   
2. Create a custom background image (with bigger width) and apply it to the combobox in a similar way:
   

       <style>
           div.RadComboBox .rcbInputCell, 
           div.RadComboBox .rcbArrowCell {
               background-image: url("custom-bgr.png");
           }
       </style>

   
   

[Antoine]

I've switched to Lightweight render mode and it works.

Thanks for your help :)

 

[Vessy]

Great! You are welcome, Antoine :)