Mobile Input Glitch

by bundyo

HTML

<script src="http://cdn.kendostatic.com/2012.2.913/js/kendo.mobile.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.913/styles/kendo.mobile.all.min.css">
<!-- Use debug on mobile to see glitch -->
<div id="view1" data-role="view" data-model="viewModel" data-show="test">

    <ul data-role="listview" data-style="inset"> 
        <!--data-role="listview" data-style="inset"-->
        <!-- Add data attributes to <ul> to initialize list view and show glitch. There are so many <li>s just to make sure doc height is enough for user to be able to scroll-->
        <li>Text<input style="border:1px solid black;margin-right:20px" type="text" value="a"/></li>
        <li>Number<input style="border:1px solid black;margin-right:20px" type="number" value="1"/></li>
        <li>Password<input style="border:1px solid black;margin-right:20px" type="password" value="1"/></li>
        <li>Text<input style="border:1px solid black;margin-right:20px" type="text" value="bb"/></li>
        <li>Number<input style="border:1px solid black;margin-right:20px" type="number" value="2"/></li>
        <li>Password<input style="border:1px solid black;margin-right:20px" type="password" value="11"/></li>
        <li>Text<input style="border:1px solid black;margin-right:20px" type="text" value="ccc"/></li>
        <li>Number<input style="border:1px solid black;margin-right:20px" type="number" value="3"/></li>
        <li>Password<input style="border:1px solid black;margin-right:20px" type="password" value="111"/></li>
        <li>Text<input style="border:1px solid black;margin-right:20px" type="text" value="dddd"/></li>
        <li>Number<input style="border:1px solid black;margin-right:20px" type="number" value="4"/></li>
        <li>Password<input style="border:1px solid black;margin-right:20px" type="password" value="1111"/></li>
        <li>Text<input style="border:1px solid black;margin-right:20px" type="text" value="eeeee"/></li>
        <li>Number<input...

CSS

/*li {
    bottom: auto;
    -webkit-transform: none;
    -moz-transform: none;
}*/

JavaScript

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

function test() {
    console.log(kendo.getComputedStyles($("#view1 .km-list > li")[0], ["webkit-transform"]));
}