Skip to content

Instantly share code, notes, and snippets.

@philhawksworth
Created November 25, 2011 17:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save philhawksworth/1393999 to your computer and use it in GitHub Desktop.
Save philhawksworth/1393999 to your computer and use it in GitHub Desktop.
centered dynamic menu
<html>
<head>
<title></title>
<style type="text/css">
.primary-nav {
width:1000px;
border:solid 1px red;
text-align:center;
}
h1 {
display:inline;
}
.nav {
display:inline-block;
border:solid 1px blue;
width: 400px;
}
.nav ul {
list-style: none;
display: inline;
margin:0;
padding:0;
}
.nav li {
display: inline;
}
.left {
text-align:right;
}
.right {
text-align:left;
}
.guide {
border:solid 1px green;
width:500px;
height:10px;
}
</style>
</head>
<body>
<div class="primary-nav">
<div class="left nav">
<ul>
<li>foo</li>
<li>bar</li>
<li>baz</li>
</ul>
</div>
<h1>center point</h1>
<div class="right nav">
<ul>
<li>foo</li>
<li>bingo</li>
<li>bobby</li>
<li>big</li>
<li>boink</li>
</ul>
</div>
</div>
<!-- to help jusge the center -->
<div class="guide"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment