RadComboBox vertical align in IE

4 posts, 0 answers
  1. Rem
    Rem avatar
    3 posts
    Member since:
    Sep 2017

    Posted 29 Aug 2018 Link to this post

    Dear Guru's,

    New here and I've been trying to implement the radcombobox to replace a lot of my current listboxes. That all seemed to go quite well, but I ran into an issue that I can't seem to solve with either documentation, google or this forum. 

    Our webapplication is used in multiple large companies and it should work under any browser the client chooses to use. I found out that the vertical alignment of the text in IE is lower than in, for example Google Chrome. I can't seem to figure out how to resolve this.

    Please see that attached image for an example. It's the exact same page, left is IE, right is Chrome. I used the "j" because you can clearly see the difference at the bottom.

    Thank you for your time!

    Best regards,

    -Rem

  2. Rumen
    Admin
    Rumen avatar
    14419 posts

    Posted 30 Aug 2018 Link to this post

    Hi Rem,

    I tried to reproduce the problem in IE11 on this the Render Modes demo with Classic and Lightweight render modes, but to not avail. Do you experience the problem in the demo?

    Can you please check whether your IE browser is not running the page in Compatibility mode? If yes, disable it and test again. You can find more on this here.
    Another problem could be some CSS class which overrides the appearance in IE. More on this is available in this article: Incorrect or Distorted Appearance.

    If the problem still persists, please provide a live URL to the problematic page or a simple runnable project so that I can investigate the issue on my side.

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Rem
    Rem avatar
    3 posts
    Member since:
    Sep 2017

    Posted 30 Aug 2018 in reply to Rumen Link to this post

    Hi Rumen,

    It was in IE 11 without any compatibility modes on. We just figured out a way to fix this and I'll post it here in case somebody else runs into the issue.

    Add this in your page:

        .rcbInput { line-height: 1 !important; }
    It will align the text in IE as it does in other browsers.

    Hope that helps anybody else!

    Best regards,

    -Rem

     

  4. Rumen
    Admin
    Rumen avatar
    14419 posts

    Posted 31 Aug 2018 Link to this post

    Thanks for sharing your way to fix it! Yes, the rcbInput class is responsible for the header input element of the combobox and can be used to customize the text position and appearance.

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top