a small css problem.

codefreek · 01-02-2008, 04:48 PM

Hello, all..

i got a problem with my css.
it's like this
i got a banner ----------- <banner
here menu ---------- <menu..
but some how i cant get it to center with the banner
i tryed evrything.. so i hope you can help me thank you..
i am sure i missed something so i am sorry but
anyways you learn by your mistakes.

ty..

HERE IS THE CSS:

PHP Code:


			
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

</head>

<style>

body {

background:#000000;

padding:0px;

margin:0px;

top:20px;



}











#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:url("tableftH.gif") no-repeat left top;

      margin:0;

      padding:0 0 0 4px;

      text-decoration:none;

     

      }

    #tabsH a span {

      float:left;

      display:block;

      background:url("tabrightH.gif") no-repeat right top;

      padding:5px 15px 4px 6px;

      color:#FFF;

      

      }

    /* 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;

      }

</style>

PHP Code:


			
<body>

<center>

  <p><img src="./banner.png" /></p>

</center>



<div id="tabsH">

  <ul>

    <li><a href="#" title="Link 1"><span>Link 1</span></a></li>

    <li><a href="#" title="Link 2"><span>Link 2</span></a></li>

    <li><a href="#" title="Link 3"><span>Link 3</span></a></li>

    <li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li>

    <li><a href="#" title="Link 5"><span>Link 5</span></a></li>

    <li><a href="#" title="Link 6"><span>Link 6</span></a></li>

    <li><a href="#" title="Link 7"><span>Link 7</span></a></li>

  </ul>

</div>



</body>

</html>