Scroll Items Horizontally

By default, the item's text is wrapped so the horizontal scrollbar does not appear if the text is long enough to go outside the listbox borders:

This article shows how to make the text of the items lie on one line thus showing the horizontal scrollbar. Here is the declaration:

<telerik:RadListBox RenderMode="Lightweight" ID="list1" runat="server"
   Width="130px" Height="200px" Skin="Office2007">
   <Items>
       <telerik:RadListBoxItem Text="ASP.NET AJAX UI Controls" />
       <telerik:RadListBoxItem Text="WinForms UI Controls" />
       <telerik:RadListBoxItem Text="WPF UI Controls" />
       <telerik:RadListBoxItem Text="Telerik Web UI Test Studio" Selected="true" />
       <telerik:RadListBoxItem Text="Telerik Open Access ORM" />
       <telerik:RadListBoxItem Text="Sitefinity CMS" />
   </Items>
</telerik:RadListBox> 

Add the following CSS rules to the

section of your page:

<style type="text/css">
    div.RadListBox .rlbText
   {
       white-space: nowrap;
       display: inline-block;
   }
   div.RadListBox .rlbGroup
   {
       overflow: auto;
   }
   div.RadListBox .rlbList
   {
       display: inline-block;
       min-width: 100%;
   }
   *+html div.RadListBox .rlbList
   {
       display: inline;
   }
   * html div.RadListBox .rlbList
   {
       display: inline;
   }
</style> 

Now the listbox will have a horizontal scrollbar: