CSS Horizontal Menu
Page 1
Page 2
Page 4
Page 4
Page 5
CSS
HTML
CSS
Click in form to highlight code and copy with
<ctrl>+<c>
to clipboard.
<style type="text/css"> <!-- #navtop { float: left; width: 100%; } #navtop ul { list-style: none; margin: 0; padding: 0; } #navtop li { display: inline; margin: 0 2px 0 0; padding: 0; } #navtop a { clear: right; color: #069; display: block; float: left; font: normal 13px Arial, Helvetica, sans-serif; margin: 0; padding: 5px 10px; text-decoration: none; white-space: nowrap; } #navtop a:hover { background-color: #609ebf; color: #fff; } #navtop #current a { background-color: #069; color: #fff; } --> </style>
HTML
Click in form to highlight code and copy with
<ctrl>+<c>
to clipboard.
<div id="navtop"> <ul> <li id="current"><a href="#sitename" title="Page 1">Page 1</a></li> <li><a href="#sitename" title="Page 2">Page 2</a></li> <li><a href="#sitename" title="Page 4">Page 4</a></li> <li><a href="#sitename" title="Page 4">Page 4</a></li> <li><a href="#sitename" title="Page 5">Page 5</a></li> </ul> </div>