CODEWITHSUNDEEP
javascriptjquery-mobilejquery-mobile-listview
Dot
Dot

Reputation: 279

Reduce gap between jquery mobile listview thumbnail and text

I have the following code I want to be able to reduce the gap between the thumbnail image and the description list inside each list view.

my css

.myParagraph.ui-li-desc {
      color:#333;
      overflow:show;
      white-space:normal;
      height:28px;
      margin-bottom:0px;
    }

my markup

 listitems_markup = '<li><img src="' + itemThumbnail + '"><div class="myParagraph"><ul data-inline="true" style="font-size:60%; font-weight:normal;"><li style="white-space:normal">You viewed ' + itemName + '</li><li style="white-space:normal">You spent '+itemTimeSpent+' on this activity</li><li style="white-space:normal">You '+itemRating+' this item</li><p class="ui-li-aside">'+itemViewedTime+'</p></ul></div></li>';

this is what it looks like

enter image description here

Upvotes: 0

Views: 1122

Answers (1)

R&#225;pli Andr&#225;s
R&#225;pli Andr&#225;s

Reputation: 3923

You might want to reduce the left padding for the list which is automatically set by most browsers.

ul{
padding-left:10px; //do not set this to 0 because of the list marks
border-left:0px;
margin-left:0px;
}

Upvotes: 1

Related Questions