TabStrip display problem on IE 10 with 125% zoom

2 posts, 0 answers
  1. Charles
    Charles avatar
    7 posts
    Member since:
    Jun 2013

    Posted 06 Dec 2013 Link to this post


    Please check the attached screenshot for the problem.

    White vertical lines on some tabs.


  2. Kate
    Kate avatar
    1898 posts

    Posted 09 Dec 2013 Link to this post

    Hello Charles,

    You are addressing an issue that is not directly related to RadControls, but to the browser's mechanism of zooming of specific HTML elements and this is why we cannot help here. Let me explain that in more details. There are two facts that need to be taken into consideration. First -  zooming resizes pictures as well (here I refer to the sprite images that that are applied in order to achieve the nicely shaped rounded corners) and second - certain percentages of zooming do not resize the picture enough so you get this appearance. For instance, I will take the RadTabStrip control (where a vertical line is shown when zoomed in/out) if the picture for the left corner is 5 pixels wide and if you resize it to 170%, that would be 8.5 pixels. Unfortunately, browsers can not resize the picture to that type of fractions yet, so the resize would either be 8 or 9 pixels. In one case, you will have a perfect look, in the other, you'll have one additional pixel (as demonstrated in the attached image).

    The case is almost identical to the controls that you are referring to. However, the case gets more complicated and the appearance gets more distorted since there are more elements involved.

    If you, need however, to use the different controls in any other version higher than IE9 you can simply apply CSS3 - border-radius, simple borders and background-colors instead of the sprite images that are currently applied. Thus, zooming the browser will not impact the appearance of the control in the browser.  Another approach that you could also try is to use the simple skin and/or the MetroTouch skin where we did not include sprite images in order to get the look of the controls.

    Unfortunately the skins using sprites are just not designed to work when the page/control is zoomed.
    However having yours and the rest of the feeback we have gathered, we definitely consider working on this issue.

    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 the blog feed now.
Back to Top