Backbutton rendering on Android with kendo application options.platform "ios" setting

3 posts, 1 answers
  1. Brandon Peterson
    Brandon Peterson avatar
    50 posts
    Member since:
    May 2007

    Posted 23 Apr 2013 Link to this post

    The backbutton widget for Kendo Mobile version 2013.1.319 renders poorly on Android mobile browsers and PhoneGap webviews (borders extend beyond left arrow) when the platform is forced as iOS.

    var app = new kendo.mobile.Application(document.body, { transition: "slide:left", platform: "ios"});

    Are there any .km-ios6 .km-back css overrides that will fix this?
  2.
  3. Answer
    Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 25 Apr 2013 Link to this post

    Hi Brandon,

    This seems to happen in Android 4.0 only, due to an overflow bug. Since there is no workaround, you can use this CSS to remove the arrow part of the button in Android:
    .km-ios.km-on-android .km-back
    {
        -webkit-mask-image: none;
        padding-left: .8em;
        margin-left: 0;
    }

    .km-ios.km-on-android .km-back:after
    {
        display: none;
    }

    Greetings,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Brandon Peterson
    Brandon Peterson avatar
    50 posts
    Member since:
    May 2007

    Posted 30 Apr 2013 Link to this post

    Kamen, thanks much for the style fix. The back button looks much better. You are a CSS pimp!

Back to Top