Results 1 to 2 of 2

Thread: center in CSS

  1. #1
    Join Date
    May 2006
    Posts
    266
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default center in CSS

    ***FIXED*** FOUND THAT THERE WAS THE WORD LEFT STILL IN IT LOL


    Hi i have this script
    Code:
    .hovermenu ul{
    text-align: center;
    font: bold 13px arial;
    text-align: center;
    height: 19px;
    width:100%;
    background-image: url(http://www.hypnosiswa.com/images/menu/main-button-tile.jpg);
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 10px 0px;
    }
    
    .sizemenu{
    position: relative;
    text-align: center;
    }
    
    .hovermenu ul li{
    position: relative;
    list-style: none;
    display: inline;
    }
    
    .hovermenu ul li a{
    position: relative;
    padding:0.5em 0.5em 0.5em 0.5em;
    text-decoration: none;
    margin-left:auto;
    margin-right:auto;
    float: left;
    color: white;
    }
    
    .hovermenu ul li a:hover{
    background-image: url(http://www.hypnosiswa.com/images/menu/main-buttonOver-tile.jpg);}
    
    html>body .hovermenu ul li a:active{ /* Apply mousedown effect only to NON IE browsers */
    border-style: inset;
    }
    and it connects with
    Code:
    <div class="hovermenu">
    <ul>
    <li><a href="http://www.dynamicdrive.com" class="sizemenu">Dynamic Drive</a></li>
    <li><a href="http://www.javascriptkit.com" class="sizemenu">JavaScript Kit</a></li>
    <li><a href="http://www.codingforums.com" class="sizemenu">Coding Forums</a></li>
    <li><a href="http://www.cssdrive.com" class="sizemenu">CSS Drive</a></li>
    <li><a href="http://www.google.com" class="sizemenu">Google</a></li>
    </ul>
    </div>

    how ever i can not get it to center the li's in the middle of the page and not to the left

    any help welcomed
    The web in one word.

  2. #2
    Join Date
    Dec 2007
    Posts
    22
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Type this: (in red)

    Code:
    <div align="center">
    <div class="hovermenu">
    <ul>
    <li><a href="http://www.dynamicdrive.com" class="sizemenu">Dynamic Drive</a></li>
    <li><a href="http://www.javascriptkit.com" class="sizemenu">JavaScript Kit</a></li>
    <li><a href="http://www.codingforums.com" class="sizemenu">Coding Forums</a></li>
    <li><a href="http://www.cssdrive.com" class="sizemenu">CSS Drive</a></li>
    <li><a href="http://www.google.com" class="sizemenu">Google</a></li>
    </ul>
    </div>
    </div>
    Plus, you've got "text-align:center" twice in your Hover menu ul class.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •