CODEWITHSUNDEEP
jquerylistviewmobileresize
Jorge
Jorge

Reputation: 259

How to resize jquery mobile listview items and divider

I want to resize the list items of my jquery mobile listview and also to resize the listview dividers to a different height. For example let's say the height for list items should be 50px and for dividers 30px.

I'm trying to override the jquery mobile css styles so I've tried changing .ui-li, .ui-content and others but it doesn't work for me and cannot find any docs about this. I'm pretty new to jQM so I'll appreciate any clue.

Upvotes: 1

Views: 4242

Answers (2)

Hexodus
Hexodus

Reputation: 12927

I just had the same problem (though my listview has no dividers). This is the solution I came up with:

#your-listview-id li {
   height: 50px;
}

Upvotes: 0

Jorge
Jorge

Reputation: 259

I solved the problem (more or less) with the items, using this code I can modify top and bottom padding:

.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li {
    padding-top:5px;
    padding-bottom:5px;
}

not perfect, but is something. Hope this helps anybody else.

Upvotes: 1

Related Questions