CODEWITHSUNDEEP
listviewjquery-mobilespace
bboysupaman
bboysupaman

Reputation: 1334

jquery mobile listview creating space between each item

I can't seem to remove the small space in between each list item. The list is much longer than what I am posting here, but I don't think that has anything to do with the issue.

I have attempted to correct it by reformatting the list several times, but to no avail. I have also referenced the jquery mobile website and still cannot locate the answer.

My Code: 

<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1," />
<!-- Website Title -->
<title>Test
</title>

<!-- Jquery Mobile Theme / Jquery Scripts -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

</head> 

<!-- Color of Background -->
<body style="background:#6e6e6e">

<!-- Start of Name page -->
<div data-role="page" id="name">

<div data-role="header" data-theme="b">
    <h1>Test</h1>
</div><!-- /header -->

<div data-role="content">   
<p>
  <ul data-role="listview" data-filter="true" data-filter-placeholder="Test..." data-inset="true" data-autodividers="true">
    <li><a href="#link2">Hello</a></li>
    <li><a href="#link3">There</a></li>
    <li><a href="#link4">World</a></li>
    <li><a href="#link5">World2</a></li>
</p>
</div><!-- /content -->

<div data-role="footer" data-position="fixed" data-theme="b">
    <h4>© 2013 ChurchySearch</h4>
</div><!-- /footer -->
</div><!-- /Name page -->

It keeps coming out looking like this: http://www.jesseandamanda.com/screenshot.png

Suggestions?

Upvotes: 3

Views: 2444

Answers (1)

Martin
Martin

Reputation: 116

That happens when you copy the code from the JQuery Mobile demo page. I guess you have the same problem with your list. Try to delete the invisible chars before each <li> to fix it. See if a few lines of <li>test</li><li>test</li> looks OK.

Upvotes: 10

Related Questions