Alignment of list items in a radlistbox

13 posts, 0 answers
  1. Steve Holdorf
    Steve Holdorf avatar
    119 posts
    Member since:
    Apr 2010

    Posted 01 Nov 2012 Link to this post

    I have a radlistbox that is located in a html table. To center the radlistbox on the page I have the <td style="text-align:center"> but by doing this the bound list item's text are also centered in the radlistbox. How can I keep the radlistbox aligned center in the html table and also have the radlistboxitem's text left aligned?

    <table>
        <tr>
            <td style="text-align:center">
                <telerik:RadListBox ...

    Thanks,


    Steve Holdorf

     
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 01 Nov 2012 Link to this post

    Hi,

    You can set a css class for RadListView and set the style as follows to achieve your scenario.

    ASPX:
    <table>
      <tr>
        <td style="text-align:center; width:400px" >
          <telerik:RadListBox ID="RadListBox1" runat="server" CssClass="leftAlign" >
             ..............
         </telerik:RadListBox>
       </td>
     </tr>       
    </table>

    CSS:
    <style type="text/css">
      .leftAlign
      {
        text-align:left !important;
      }
    </style>

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Steve Holdorf
    Steve Holdorf avatar
    119 posts
    Member since:
    Apr 2010

    Posted 02 Nov 2012 Link to this post

    It works great! You guys are the best.

    Thanks,


    Steve Holdorf
  5. Mayur
    Mayur avatar
    34 posts
    Member since:
    Mar 2012

    Posted 14 Feb 2014 in reply to Princy Link to this post

    I have used the same css, but the code is working fine in firefox, but not in IE8,IE9 and IE10 , so please guide me if you have any solutions for this
  6. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 17 Feb 2014 in reply to Mayur Link to this post

    Hi Mayur,

    Unfortunately I couldn't replicate the issue at my end. Please try the following CSS which works fine at my end.

    CSS:
    <style type="text/css">
        .RadListBox_Default .rlbText, .RadListBox_Default .rlbItem
        {
            text-align: left !important;
        }
    </style>

    Thanks,
    Princy.
  7. Mayur
    Mayur avatar
    34 posts
    Member since:
    Mar 2012

    Posted 24 Feb 2014 Link to this post

    Hi,

    I am using raddatepicker and i want difference between 2 dates using javascript

    Here is my code,

      var startDate = $find('<%=dtStart.ClientID%>');
                        var endDate = $find('<%=dtEndDate.ClientID%>');

                        if ((startDate.get_selectedDate() != null) && (endDate.get_selectedDate() != null)) {
                            var days = (startDate.get_selectedDate() - endDate.get_selectedDate());
                        }

    But my days is returning some negative value -250000 something like this whereas i want difference
  8. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 24 Feb 2014 in reply to Mayur Link to this post

    Hi Mayur,

    Please try the following JavaScript which works fine at my end.

    JavaScript:
    <script type="text/javascript">
        function Differnce() {
          var startDate = $find('<%=RadDatePicker1.ClientID%>');
            var endDate = $find('<%=RadDatePicker2.ClientID%>');
            var date1 = startDate.get_selectedDate();
            var date2 = endDate.get_selectedDate();
            if ((date1!= null) && (date2!= null)) {
                var timeDiff = Math.abs(date2.getTime() - date1.getTime());
                var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
            }
                alert(diffDays);
    }
    </script>

    Thanks,
    Princy.
  9. Mayur
    Mayur avatar
    34 posts
    Member since:
    Mar 2012

    Posted 24 Feb 2014 in reply to Princy Link to this post

    Hi, the script really works

    Thank you. :)
  10. Mayur
    Mayur avatar
    34 posts
    Member since:
    Mar 2012

    Posted 25 Feb 2014 Link to this post

    Hi,

    Title - RadAjaxLoadingPanel waiting circle image not animating while redirecting page

    I have RadPanelBar inside RadSplitter on master page.
    I am calling different pages on click of RadPanelItem of RadPanelBar from master pages.
    I have AjaxManager on master page with RadLoadingPanel for showing loading image.
    Loading image doesnot animate when I redirects to another page but it works fine for other functionality.

    If have any solutions,Please suggest.

    Thank you.


  11. Mayur
    Mayur avatar
    34 posts
    Member since:
    Mar 2012

    Posted 25 Feb 2014 Link to this post

    Title - radgrid last column not resizing correctly

    I have radgrid which contains 4 columns.

    1)I have set property AllowColumnResize="true" of grid.
    2)Resizing works fine for first 3 columns but for last column it doesnot work properly.
    3)Last column resize to decrease width only and I am not able to increase width of last column.

  12. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 26 Feb 2014 in reply to Mayur Link to this post

    Hi Mayur,

    As for your first post, redirecting from one page to another page will not invoke any server request, so there will be no Ajax request and LoadingPanel will not show this the expected behavior.

    For the next issue on RadGrid, please try enabling ResizeGridOnColumnResize.

    ASPX:
    <ClientSettings Resizing-AllowColumnResize="true">
        <Resizing ResizeGridOnColumnResize="true" />
    </ClientSettings>

    Thanks,
    Princy
  13. Kiran
    Kiran avatar
    2 posts
    Member since:
    Mar 2015

    Posted 27 Mar 2015 Link to this post

    How can we remove the space or padding between the items in the radlistbox ? 
  14. Magdalena
    Admin
    Magdalena avatar
    421 posts

    Posted 01 Apr 2015 Link to this post

    Hello Kiran,

    The spacing between items can be customized by setting different line-height by the "html .RadListBox .rlbItem" selector.

    Regards,
    Magdalena
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017