Advanced Search

Results 1 to 6 of 6

Thread: centering css nav bar

  1. #1
    Join Date
    Jun 2008
    Posts
    7
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default centering css nav bar

    There's probably a simple answer for this, but here goes: I am using the Vista Aero Buttons Menu and it's looking great with one exception. How do I get it to center the whole bar as opposed to aligning to the left?

    Here's my test site to show you what I mean:

    http://www22.myfantasyleague.com/2008/home/71589

    Thanks in advance for your help!

  2. #2
    Join Date
    Jun 2008
    Posts
    7
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    This one's got everyone stumped, eh?

  3. #3
    Join Date
    Jul 2007
    Location
    Azerbaijan, Baku
    Posts
    144
    Thanks
    11
    Thanked 27 Times in 25 Posts

    Default

    Hmm.
    to place it in center you just need to give to that menu:
    Code:
    margin-right:auto;
    margin-left:auto;
    But i think you can't do it cause of your .rightsection . If you will delete it and place what i give to that menu. it will be in center.

  4. The Following User Says Thank You to allahverdi For This Useful Post:

    nolanbuc (07-02-2008)

  5. #4
    Join Date
    Apr 2008
    Location
    Limoges, France
    Posts
    395
    Thanks
    13
    Thanked 61 Times in 61 Posts

    Thumbs down

    Start at the menu div and replace your code with what is below. Note the style of the menu div and the explicit width the .aerobuttonmenu class was given. You'll also need to find another place for .rightsection . (You could keep it in the same place but that would require some more explanation and i don't have the time right now.)

    Constructive criticism: Your site is built on some really really really messy source code.

    HTML Code:
    <div class="aerobuttonmenu black" style="margin: 0 auto;">
    
    
    
    <a href="http://football22.myfantasyleague.com/2008/standings?L=41628" class="aero"><span>Standings</span></a> 
    <a href="http://www22.myfantasyleague.com/2008/live_scoring_summary?L=41628&W=1" class="aero"><span>Live Scoring</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=123" class="aero"><span>Calendar</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=73" class="aero"><span>League News</span></a> 
    <a href="http://z14.invisionfree.com/World_FFL/index.php?c=1" target="_blank" class="aero"><span>Forums</span></a> 
    <a href="http://wstf.cbox.ws" target="_blank" class="aero"><span>Chat</span></a>
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=112" class="aero"><span>History</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=121" class="aero"><span>Pool Picks</span></a>
    
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=120" class="aero"><span>Survivor</span></a>
    <a href="http://www22.myfantasyleague.com/2008/home/41628" class="aero"><span>HOME</span></a>
    </div>
    
    <style type="text/css">
    
    .aerobuttonmenu{ /*container that holds a row of aero buttons*/
    overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
    width:890px;
    background: transparent; /*menu strip background*/
    border: 1px solid gray;
    padding: 4px 0;
    border-width: 1px 0;
    }
    Good Luck,

    Jason

  6. The Following User Says Thank You to JasonDFR For This Useful Post:

    nolanbuc (07-02-2008)

  7. #5
    Join Date
    Apr 2008
    Location
    Limoges, France
    Posts
    395
    Thanks
    13
    Thanked 61 Times in 61 Posts

    Default

    Sorry about the little thumbs down icon. I must have accidentally selected it.

    Cheers,

    J

  8. The Following User Says Thank You to JasonDFR For This Useful Post:

    nolanbuc (07-02-2008)

  9. #6
    Join Date
    Jun 2008
    Posts
    7
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by JasonDFR View Post
    Start at the menu div and replace your code with what is below. Note the style of the menu div and the explicit width the .aerobuttonmenu class was given. You'll also need to find another place for .rightsection . (You could keep it in the same place but that would require some more explanation and i don't have the time right now.)

    Constructive criticism: Your site is built on some really really really messy source code.

    HTML Code:
    <div class="aerobuttonmenu black" style="margin: 0 auto;">
    
    
    
    <a href="http://football22.myfantasyleague.com/2008/standings?L=41628" class="aero"><span>Standings</span></a> 
    <a href="http://www22.myfantasyleague.com/2008/live_scoring_summary?L=41628&W=1" class="aero"><span>Live Scoring</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=123" class="aero"><span>Calendar</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=73" class="aero"><span>League News</span></a> 
    <a href="http://z14.invisionfree.com/World_FFL/index.php?c=1" target="_blank" class="aero"><span>Forums</span></a> 
    <a href="http://wstf.cbox.ws" target="_blank" class="aero"><span>Chat</span></a>
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=112" class="aero"><span>History</span></a> 
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=121" class="aero"><span>Pool Picks</span></a>
    
    <a href="http://football22.myfantasyleague.com/2008/options?L=41628&O=120" class="aero"><span>Survivor</span></a>
    <a href="http://www22.myfantasyleague.com/2008/home/41628" class="aero"><span>HOME</span></a>
    </div>
    
    <style type="text/css">
    
    .aerobuttonmenu{ /*container that holds a row of aero buttons*/
    overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
    width:890px;
    background: transparent; /*menu strip background*/
    border: 1px solid gray;
    padding: 4px 0;
    border-width: 1px 0;
    }
    Good Luck,

    Jason
    Thank you for your help!

    About the state of my code, I'm fairly new to CSS and have cobbled the site together with whatever worked. Any suggestions on how to clean it up abit?

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
  •