Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Senior Coder
    Join Date
    Aug 2002
    Location
    Kansas City, Kansas
    Posts
    1,518
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Center Aligning Difficulties

    Why won't my menu bar center align? http://www.graphics-forum.com/manicpyro

  • #2
    Banned
    Join Date
    Feb 2004
    Posts
    91
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Because there is no tag around the menu bar that tells it to center.

    Love the style choice, it's very relaxing.

  • #3
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi Antonio;

    It is aligned left because the links width is undefined
    and you are foating the containing unordered list left.

    Try these changes:
    (you may need to play with the numbers)
    Code:
    #links{
      margin: 0 auto;
      padding: 0px;
      width: 612px;
      text-align: center;
    }
    #links ul {
      border: none;
      margin: 0;
      padding: 0;
      list-style-type: none;
      text-align: center;
      clear: left;
    }
    #links ul li {
      display: block;
      float: left;
      text-align: center;
      padding: 0;
      margin: 0;
    }
    #links ul li a {
      background: #B2B2B2;
      width: 122px;
      height: 2em;
      border-top: 1px solid #808080;
      border-left: 1px solid #808080;
      border-bottom: 1px solid #808080;
      border-right: none;
      padding: 0;
      margin: 0 0 10px 0;
      color: #424242;
      text-decoration: none;
      display: block;
      text-align: center;
      line-height: 2em;
      font-size: x-small;
      voice-family: "\"}\"";   
      voice-family: inherit;   
      font-size: x-small; 
    }
    Also; I would change the name links since I believe links is a collection
    (document.links) and is probably a reserved word and could cause
    unexpected problems.

    .....Willy

  • #4
    Senior Coder
    Join Date
    Oct 2003
    Location
    Australia
    Posts
    1,963
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Center Aligning Difficulties

    Originally posted by Antoniohawk
    Why won't my menu bar center align? http://www.graphics-forum.com/manicpyro
    Hey man, nice site, very simple.

    Q.First up, how does #links differ from #title and #content? (The other elements on which margin:0 auto; is effective).
    A. The other div's have a fixed width. I added width:600px; to #links and it's all good. (sort of...you'll see)

    My guess is that trying to give an element with an undetermined width margin:auto, which is nested inside another element without a fixed width (body/viewport) is either against W3C guidlines or causing the browser to bug out.
    Another solution to giving all elements a determined width may be to assign a 100% width to the body tag. This is untested and may very well cause other problems, especially regarding accessibility.

    Andrew.

    *edit: LOL Willy! I type too damn slow

    I take no responsibility for the above nonsense.


    Left Justified

  • #5
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Re: Center Aligning Difficulties

    Originally posted by mindlessLemming
    *edit: LOL Willy! I type too damn slow
    I didn't bother to check my spelling!

    .....Willy

  • #6
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    About ala?!!

    Guess where that menu bar is coming from...
    (Hint: ALA ).

    Update:

    while you're borrowing from the best anyway: ala uses a wrapper div around the whole page which has a set width and margin-left and -right: auto, which centers every box inside the wrapper nicely.
    Last edited by ronaldb66; 02-18-2004 at 02:04 PM.
    Regards,
    Ronald.
    ronaldvanderwijden.com


  •  

    Posting Permissions

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