I need help centering this navigation bar I got from Exploding Boy. If you don't want to download it, this is the code.

<style type="text/css">
   


/*- Menu Tabs H--------------------------- */

    #tabsH {
      float:left;
      width:100%;
      background:#000;
      font-size:93%;
      line-height:normal;
      }
    #tabsH ul {
    margin:0;
    padding:10px 10px 0 50px;
    list-style:none;
      }
    #tabsH li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsH a     { float: left; background-image: url('tableftH.gif'); background-repeat: 
               no-repeat; background-color: left; background-attachment: 
               scroll; text-decoration: none; margin: 0; padding-left: 4px; 
               padding-right: 0; padding-top: 0; padding-bottom: 0; 
               background-position: top }
#tabsH a span { float: left; display: block; background-image: url('tabrightH.gif'); 
               background-repeat: no-repeat; background-attachment: scroll; 
               color: #FFF; padding-left: 6px; padding-right: 15px; 
               padding-top: 5px; padding-bottom: 4px; background-position: 
               right top }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsH a span {float:none;}
    /* End IE5-Mac hack */
    #tabsH a:hover span {
      color:#FFF;
      }
    #tabsH a:hover {
      background-position:0% -42px;
      }
    #tabsH a:hover span {
      background-position:100% -42px;
      }


     background:#F4F4F4;
      font-size:93%;
      line-height:normal;
      border-bottom:1px solid #24618E;
      }
    #tabsJ ul {
    margin:0;
    padding:10px 10px 0 50px;
    list-style:none;
      }
    #tabsJ li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsJ a     { float: left; background-image: url('tableftJ.gif'); background-repeat: 
               no-repeat; background-color: left; background-attachment: 
               scroll; text-decoration: none; margin: 0; padding-left: 5px; 
               padding-right: 0; padding-top: 0; padding-bottom: 0; 
               background-position: top }
#tabsJ a span { float: left; display: block; background-image: url('tabrightJ.gif'); 
               background-repeat: no-repeat; background-attachment: scroll; 
               color: #24618E; padding-left: 6px; padding-right: 15px; 
               padding-top: 5px; padding-bottom: 4px; background-position: 
               right top }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsJ a span {float:none;}
    /* End IE5-Mac hack */
    #tabsJ a:hover span {
      color:#FFF;
      }
    #tabsJ a:hover {
      background-position:0% -42px;
      }
    #tabsJ a:hover span {
      background-position:100% -42px;
      }

</style>

How do I center it? If I change the float to none, it goes bonkers. Thanks! Please bear in mind that I barely know CSS.

Thanks,
FGU

It would be helpful to have a link to the live HTML.
I would also suggest cleaning up that CSS code. Seems a bit messy.

without HTML is not easy to answer on your question, but try

#tabsH {
float:left;
width:100%;
background:#000;
font-size:93%;
line-height:normal;
text-align : center;
}

Shivaji

Sorry shivaji, no go. Here's the HTML.

<p align="center"><div id="tabsH">
  <ul>
    <li>
      <p align="center"><a href="/gamespage1" title="Games Page 1"><span>Games
      Page 1</span></a></li>
    <li>
      <p align="center"><a href="/gamespage2" title="Games Page 2"><span>Games
      Page 2</span></a></li>
    <li>
      <p align="center"><a href="/forum" title="Forums"><span>Forums</span></a></li>
    <li>
      <p align="center"><a href="/testarea" title="Testarea"><span>Testarea</span></a></li>
    <li>
      <p align="center"><a href="/news" title="News"><span>News</span></a></li>
    <li>
      <p align="center"><a href="/Support%20Us.htm" title="Support Us"><span>Support
      Us</span></a></li>
    <li>
      <p align="center"><a href="/Search.htm" title="Search"><span>Search</span></a></li>
  </ul>
</div></p>

Get rid of the <p> centering tag.
Again, it would be much easier if you provided a link to a hosted copy of the web site.

www.fungamesuniverse.com/test/

Try this,

#tabsH {
width : 700px; /* fit here width */
margin-left : auto;
margin-right : auto;
background:#000;
font-size:93%;
line-height:normal;
}

BTW, remove p tags from menu bar.

Shivaji