View Single Post - Using a list for navigation, can you center a list?

tonyb · #3 (**permalink**) May 5th, 2008, 22:05

Sorry should have done that. Thanks a lot, here you go:

<div class="nav">

Code: Select all

<ul id="nav">
      <li id="home"><a href="index.html">Home</a></li>
      <li id="paintings"><a href="paintings.html">Paintings</a></li>
      <li id="books"><a href="books.html">Books</a></li>
      <li id="artist"><a href="artist.html">The Artist</a></li>
      <li id="gallery"><a href="gallery.html">Blue Anchor Gallery</a></li>
      <li id="contact"><a href="contact.html">Contact/Ordering</a></li>
  </ul>
</div>
 
body {                 /*part of attempt to center list*/
                text-align: center;
}
div.nav {               /*part of attempt to center list*/ 
                margin-left: auto;
                margin-right: auto;
}
#nav {
                list-style: none;           /*to remove bullet points*/
}
#nav li {
                margin: 0;
                padding: 0;
                float: left;
}
#nav a {
                display: block;
                margin: 0;
                padding: 4px 8px;
                color: #663333;
                text-decoration: none;
                background-color: #FFFFFF;
                font-family: Arial, Helvetica, sans-serif;
                font-weight: bold;
}
#nav a:hover, body#home #home a{
                color: #FFFFFF;
                border-color: #727377;
                background-color: #003300;
                }