faster is better than slow | Download Swift
+ Reply to Thread
Results 1 to 6 of 6

Thread: centering navigation- nav2

  1. #1


    centering navigation- nav2

    Please give me some guidance on centering the content of my nav2. Everything I try just adjusts the container. I want to center the categories over the content of the body. My site is down in Maintenance Mode but here is my Nav-Full.css. Maybe I'm not even looking in the right spot?! Thanks so much for any advice.


    /*--------------- NAVIGATION(for full width layout) -----------------------------------*/
    #nav1-container,
    #nav2-container{background:#f2f2f2;}
    #nav1-container {border-bottom:solid 5px #069;}
    #nav2-container {border-top:solid 5px #069;}
    ul.navigation{float:left;}
    .navigation, .navigation ul {margin:0; padding:0; list-style-type:none;
    position:relative;}
    .navigation ul{margin-left:-9px;}
    .navigation li ul {z-index:120;}
    .navigation a {display:block; padding:4px 12px;border-right:1px solid #CCC; text-decoration:none; color:#000}
    .navigation a:hover,.navigation li.current-menu-item a{color:#fff}
    .navigation li:hover,.navigation li.current-menu-item a{background:#069 }
    .navigation li:hover a{color:#FFF}
    .navigation li {float:left; position:relative;}
    .navigation ul {position:absolute; display:none; width:144px; top:24px; left:8px;background:#069; padding-bottom:5px}

    .navigation ul li a{border-width:0 0 1px;color:#FFF}
    .navigation ul li a:hover{background:#005884}
    .navigation ul a {border-left:1px solid #CCC;}
    .navigation li ul { width:192px; border:solid 1px #CCC; border-width:0 1px 1px;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;}
    .navigation li ul a {width:168px; height:auto; float:left; }
    .navigation ul ul {top:auto;}
    .navigation li ul ul {left:180px; margin:0px 0 0 12px;}
    .navigation li:hover ul ul, .navigation li:hover ul ul ul, .navigation li:hover ul ul ul ul {display:none;}
    .navigation li:hover ul, .navigation li li:hover ul, .navigation li li li:hover ul, .navigation li li li li:hover ul {display:block;}
    #rss-links{float:right;margin:.3em 10px 0 0;font-size:.8em;}
    ul#rss-links li{display:inline; text-decoration:none; padding:0.25em .3em;}
    ul#rss-links li a{text-decoration:none;}

  2. #2


    1 out of 1 members found this post helpful.
    add this code to custom CSS

    Code:
    .navigation{margin-right:300px;}
    Adjust the value for centering.

  3. #3


    Thank you so much! .navigation{margin-left:5%} worked perfectly. My only problem now is that it moved #nav1 and #nav2. I need to move them separately as they are different lengths. Any advice?

  4. #4


    1 out of 1 members found this post helpful.
    use this code
    Code:
    #nav1-container .navigation{margin-right:300px;}
    #nav2-container .navigation{margin-right:300px;}

  5. #5


    Perfest Satish. Thank you so very much. I was able to adjust the font size in here too. Do you know of a way to make the background translucent and also show just a bit above #nav1? My image is a bit harsh and the border on top might look better too.

    And I believe I am out of questions after that.

  6. #6


    anyone please?

+ Reply to Thread

Similar Threads

  1. Moving Nav2 Container
    By infinet in forum Support
    Replies: 2
    Last Post: 03-16-2012, 11:29 AM
  2. Centering Logo
    By vbroad36 in forum Bug report and suggestions.
    Replies: 2
    Last Post: 01-02-2012, 11:57 PM
  3. nav2 category order
    By ering in forum Support
    Replies: 1
    Last Post: 02-06-2010, 03:49 AM
  4. Centering your logo
    By DJM in forum Bug report and suggestions.
    Replies: 1
    Last Post: 12-11-2009, 07:33 PM
  5. Centering Google Ad Under Top Nav
    By IRIEARCE in forum Support
    Replies: 1
    Last Post: 11-13-2009, 12:04 PM

Tags for this Thread

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