How to make 'onItemDisclosure' arrow for a list appear in the middle of the item (vertically)

Setting on onItemDisclosure to true in the configuration options for my list makes the arrow appear but it is at the top of the list rather than at the middle. If the list items were of a fixed height I could add margin to put it lower down but because each item of the list can开发者_如何转开发 vary in height this won't be suitable.

Any ideas gratefully received.

Thanks.

---

To this css rule .x-list .x-list-disclosure add position: relative; top: 28%; or any percent you want. You can add this inline in the index.html after the main css file.

---

Use following for the parent item css and will work best ever:

display: -webkit-box;
-webkit-box-orient: horizontal;
-webkit-box-pack: center;
-webkit-box-align: center;

This is webkit specific and works perfectly with Sencha Touch. So, the code will be:

.x-list .x-list-item{
    display: -webkit-box;
    -webkit-box-orient: horizontal;
    -webkit-box-pack: center;
    -webkit-box-align: center;
}

---

To get true centering:

.x-list .x-list-disclosure {
    height: auto;
    -webkit-mask-position-y: center;
    margin-top: 0;
}