Menu Options Border in Chrome

2 posts, 0 answers
  1. Janio
    Janio avatar
    1 posts
    Member since:
    Oct 2014

    Posted 20 Oct 2014 Link to this post

    Hi all. I am testing the menu kendo framework and I am having a issue. In IE 11, late Firefox version and Safari, does not happen, only happens in Google Chrome.

    With normal zoom (100%) the menu options seems to be good. But when I set the zoom to 125%, only in some menu items, the lefthand border disappear, even the option top border. It appears again when I set the zoom to 130% or less (120% e.g.).

    It also happens when I restore down the window. I send an image with the behaviour.

    Anyone had the same problem?
  2. Dimo
    Dimo avatar
    8471 posts

    Posted 23 Oct 2014 Link to this post

    Hello Janio,

    It seems that the discussed scenario uses a custom Kendo UI theme. In such cases it is better to send a runnable example (or a live URL), that includes all the custom CSS code, which we don't have. I tried to reproduce the described issue by using some custom styles, but to no avail.

    Generally, all browsers have issues with zoomed content and sub-pixel rendering, which can be exhibited in random overlapping or disappearing content at certain zoom levels, but not at others. Sometimes a possible workaround is to replace styles that use relative units (em's) with styles that use absolute units (pixels). For example, try setting all Menu-related paddings, font-sizes and line-heights in pixels.


    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Back to Top