Long text in RadListBox

2 posts, 0 answers
  1. reidfenn
    reidfenn avatar
    5 posts
    Member since:
    Apr 2012

    Posted 25 Apr 2012 Link to this post

    How does RadListBox handle long text in RadListBox ?

    I have a RadListBox with checkBoxes.  Long text is not getting indented.  It should be left aligned and consistent with the other items which have short text.

    Thank you
  2. Richard
    Richard avatar
    479 posts
    Member since:
    Nov 2011

    Posted 27 Apr 2012 Link to this post


    You can accomplish the proper alignment of the text with your checkboxes in the RadListView with CSS as follows:

    <head runat="server">
        <style type="text/css">
            .childItems .rlbText
                display: block !important;
                vertical-align: middle !important;
            .childItems .rlbCheck
                float: left !important;
        <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                <%--Needed for JavaScript IntelliSense in VS2010--%>
                <%--For VS2008 replace RadScriptManager with ScriptManager--%>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <div class="title">
                Checkboxes only:</div>
            <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
                <div class="list-panel">
                    <telerik:RadListBox ID="RadListBox1" runat="server" CheckBoxes="true" Width="200px"
                        Height="300px" OnClientItemChecking="OnClientItemCheckingHandler">
                            <telerik:RadListBoxItem CssClass="childItems" Text="Arts" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Biographies" Checked="true" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Children's Books" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Computers � Internet" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="This is a very long, long, long text string here" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Cooking" Checked="true" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="History" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Fiction" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Mystery" Checked="true" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Nonfiction" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Romance" />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Science Fiction " />
                            <telerik:RadListBoxItem CssClass="childItems" Text="Travel" />

    I'm attaching a screenshot showing output.

    Hope this helps!
Back to Top