RadTextBox bigger font size weirdness in IE

6 posts, 1 answers
  1. chris_cf
    chris_cf avatar
    53 posts
    Member since:
    Jul 2007

    Posted 13 Sep 2012 Link to this post

    I've got a RadTextBox which I set the font-size to "XX-Large". In IE, when the page loads, the control looks like this:

    When I focus and backspace on it, it looks like this:


    Only when it then loses focus, it is aligned correctly:


    Using 2012 Q2. Only tested in IE 9 and 10.
  2. chris_cf
    chris_cf avatar
    53 posts
    Member since:
    Jul 2007

    Posted 13 Sep 2012 Link to this post

    Additionally, in IE10, the text is cut off at the top and right side until it is edited.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tim Barton
    Tim Barton avatar
    30 posts
    Member since:
    Apr 2003

    Posted 15 Sep 2012 Link to this post

    I am glad I am not the only one who sees this.  I opened a ticket last week and I haven't seen it put in the issue tracker and they said they don't know when it will be fixed.   This is a show stopper for us as it looks very unprofessional. It also happens when you use the Empty Message property.

    It seems if you change the font size for this control, it starts acting this way. If I leave the font size alone, it works as expected. 
    Also, if you enable the ShowSpinButtons, the control does not adhere to the width property nor font-size when navigating to http://computername instead of http://localhost.  See  attached picture.  

    I am using a certain font size for my project and want to keep the size consistent.

    My Environment is as follows:
    Windows 8 Final
    IE 10 (happens on IE 9 when pages served by IIS 8)
    IIS 8

    This only happens in IE and not Firefox, Safari, or Chrome
  5. Answer
    Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 17 Sep 2012 Link to this post

    Hi,

    The RadInput serialize styles like font-size, width, heigth, color etc. to be able to change them dynamically on focus/blur/hover/enabled/disabled. Then the client side object applies this styles to the visible input element on the page. And the problem with IE is that it does not visualize it properly when font size is dinamically set using JavaScript.

    The issue can be avoided by using CSS for setting the font size, instead of the inline setting.

    Kind regards,
    Vasil
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  6. chris_cf
    chris_cf avatar
    53 posts
    Member since:
    Jul 2007

    Posted 17 Sep 2012 Link to this post

    That works Vasil. Thank you very much!
  7. Jon
    Jon avatar
    35 posts
    Member since:
    Sep 2013

    Posted 03 Jun 2015 Link to this post

    Thanks, it worked for me too.  It's great to have a good support community!

    To be clear, I had:

    <telerik:RadTextBox ID="RadTextBox1" runat="server"
            Width="250"
            Font-Size="16px"
            Height="32px"/>

     

    This text was sometimes cut off like others showed.  I changed it as follows.  I added a css class called largeFont.

    .largeFont
    {
        font-size:16px !important;
    }

     

    Then changed my markup to this:

    <telerik:RadTextBox ID="RadTextBox1" runat="server"
            Width="250"
            CssClass="largeFont"
            Height="32px"/>

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