CODEWITHSUNDEEP
jquerycssjquery-mobile
user700284
user700284

Reputation: 13620

Styling the listview to hide the small gap between items in a listview in jquery mobile

I have a listview and what I want to do is to to stye the list view in such a way that we dont see each item in the list in a "box"(the default way in which listview) appears.I have applied some css but still there is a small gap between each list items.Please help me in solving this.

This is the css i have used

    .list li{
                border-width:-5px !important;
                border-top-width:0px !important;
                background:#cccccc;
}

Thanks in advance.

A sample here - http://jsfiddle.net/Lvp9j/

Upvotes: 0

Views: 2694

Answers (2)

Gilson Nunes
Gilson Nunes

Reputation: 11

Setting border-top: 0 isn't a god option if you're using borders on your list. Instead, you can set the space between the items like this:

.ui-li {
    margin-bottom: -1px !important;
}

Upvotes: 1

scessor
scessor

Reputation: 16115

Add following css code (you can remove the border-width and border-top-width rule):

.ui-li {
    border-top: 0;
}

Also see my jsfiddle.

Upvotes: 2

Related Questions