RadComboBox for ASP.NET

Side effects of percentage values set to the Combobox Width Send comments on this topic.
TroubleShooting > Side effects of percentage values set to the Combobox Width

Glossary Item Box

Telerik RadComboBox version 2.5.3+

No side effects are observed.

Telerik RadComboBox version 2.5.2

The combobox width can be set in percentage values now. You should consider the following side-effects:

  • The combobox is shown as a block element. In other words, each control, even text that is placed right after the combobox will appear under the combobox, like:

    Example: 

    ASPX Copy Code
    <rad:RadComboBox
       
    ID="RadComboBox1"
       
    runat="server"
       
    Skin="Classic"
       
    Width="50%"
       
    style="">
    </
    rad:RadComboBox>
    <
    div>Some text</div>

    Design Time:


    Run Time:


    To change this behavior, you can apply style="float:left" to the combobox instance or use any container (i.e. tables) to build the needed layout:

    Example:

    ASPX Copy Code
    <rad:RadComboBox
       
    ID="RadComboBox1"
       
    runat="server"
       
    Skin="Classic"
       
    Width="50%"
       
    style="float: left">
    </
    rad:RadComboBox>
    <
    div>Some text</div>

    Design Time:


    Run Time:


    To summarize, every time you place any control or text after the combobox, you should apply the style="float:left" to the combobox.

    Even in a more complex scenario:

    Example:

    ASPX Copy Code
    <rad:RadComboBox
       
    ID="RadComboBox1"
       
    runat="server"
       
    Skin="Classic"
       
    Width="20%"
       
    style="float:left">
    </
    rad:RadComboBox>
    <
    div style="float:left">sassasasasasa</div>
    <
    rad:RadComboBox
       
    ID="RadComboBox2"
       
    runat="server"
       
    Skin="Classic"
       
    Width="30%">
    </
    rad:RadComboBox>

    Design Time:


    Run Time:


    If the text is placed before the combobox, then you should apply the style="float:left" to the div element containing the text:

    Example:


    ASPX Copy Code
    <div style="float:left">sasasasa</div>
    <
    rad:RadComboBox
       
    ID="RadComboBox1"
       
    runat="server">
       
    <Items>
         
    ...
       
    </Items>
    </
    rad:RadComboBox>

    Design Time:


    Run Time:

  • If no width is set to the combobox, then 150px is the default value of the width.
  • When the width is set in px values, then the combobox appears wider in design time than it is at run-time. This is only a design time limitation and has no effect on the run-time of the application.