Skip to content

Instantly share code, notes, and snippets.

@cgack

cgack/jsbin.acIRUBo.css

Created May 8, 2014 14:36
Show Gist options
  • Save cgack/cae4af93de3993bda06c to your computer and use it in GitHub Desktop.
Save cgack/cae4af93de3993bda06c to your computer and use it in GitHub Desktop.
Download ZIP
change css for navbar
Raw
jsbin.acIRUBo.css
.cg-navbar {
max-width: 100%
}
.cg-navbar__bar {
padding: 0;
display: table; table-layout:fixed; width: 100%;,
}
.cg-navbar__baritem{
display: table-cell;
}
Raw
jsbin.acIRUBo.html
<!DOCTYPE html>
<html>
<head>
<title>jQuery Mobile issue template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/git/jquery.mobile-git.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/mobile/git/jquery.mobile-git.js"></script>
<script>
// Your JavaScript ...
</script>
<style>
#edit-with-js-bin { display: none !important; }
</style>
</head>
about<body>
<div data-role="page">
<div data-role="header">
<h1>Issue template</h1>
</div><!-- /header -->
<!--<div class="selector" data-role="navbar" >
<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
</ul>
</div>-->
<div class="cg-navbar selector" >
<ul class="cg-navbar__bar" >
<li class="cg-navbar__baritem"><a class="ui-link ui-btn ui-btn-active" href="#">Item 1</a></li>
<li class="cg-navbar__baritem"><a class="ui-link ui-btn" href="#">Item 2</a></li>
</ul>
</div>
<div class="ui-content">
<p>See the <a href="https://github.com/jquery/jquery-mobile/blob/master/CONTRIBUTING.md#issues" target="_blank">Contributing Guidelines</a> for instructions.</p>
<p>Use the "Live preview" for testing: click on the arrow in the top right corner of the "Output" panel.</p>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment