Search jQuery

jQuery Forum

Using larger icons (30x30) in listviews?

in jQuery Mobile • 8 years ago

Hello, I've found those icons I'd like to use in listviews.
The icons have got a size of 30x30px.

If I use the class "ui-li-icon" for the images, they gonna be resized to 16x16.

<ul data-role="listview" data-inset="true" data-theme="b" data-dividertheme="b">
<li data-role="list-divider">Menu</li>
<li><a href="/link1"/><img src="/images/icons/icon-mail.png" class="ui-li-icon" alt="" />Link1</a></li>
</ul>

If I don't use that class, the item will have a double height. How can I fix that problem?

Replies(3)

haga0054

Re: Using larger icons (30x30) in listviews?

8 years ago

This can be solved with custom CSS. If you aren't sure how to do that I would read some documentation on CSS. You can inspect each element and see CSS properties and modify as necessary.

If you want a bigger icon I would first look at changing the size of list items. If you try and can't figure it out please post an example (perhaps jsfiddle.net) and let me know what you did and why it won't work. I'll see if I can help from there.

On a side note I am not really sure what you want, so I would at the very least post an example of what you are talking about. By the item do you mean list item?