Kod prawie żywcem wzięty ze strony "producenta"
Czemu zawsze ostatnio guzik się wyświetla nieprawidłowo ?
I to niezależnie od szerokości ekranu.
Próbowałem to też na 2 komórkach i tablecie, wszędzie źle.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page" id="foo">
<div data-role="tabs" id="tabs">
<div data-role="navbar">
<ul>
<li><a href="#one" data-ajax="false">one</a></li>
<li><a href="#two" data-ajax="false">two</a></li>
<li><a href="ajax-content-ignore.html" data-ajax="false">three</a></li>
</ul>
</div>
<div id="one" class="ui-body-d ui-content">
<h1>First tab contents</h1>
</div>
<div id="two">
<ul data-role="listview" data-inset="true">
<li><a href="#">Acura</a></li>
<li><a href="#">Audi</a></li>
<li><a href="#">BMW</a></li>
<li><a href="#">Cadillac</a></li>
<li><a href="#">Ferrari</a></li>
</ul>
</div>
</div>
</div><!-- /page -->
</body>