SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Stuck on how to center text in the navigation

    I working a redesign of my current site, and I can't figure out how to center the text in the navigation. I can float the text over the right or to the left, but I want text to be centered in the link area.

    My redesign test page can be found here.

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi, do these changes
    Code:
    #nav li{text-align:center;/*will center text*/
    #nav li a{float:none;display:block;/*makes it so the text align will work*/}
    You don't actually need the display:block; on the anchor, but if you ever wanted to add vertical padding or what not, keeping that in there will avoid any future problems should you eventually want it . Taking it out/keeping it in has no difference on the layout.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks again Ryan!

    I added the two lines to my CSS file, and the main menu is now centered just like I wanted it. However now the drop-down menues are being centered. I want the drop-down menus to be left aligned.

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    You could add this to your style sheet:

    Code:
    #nav li li {text-align: left;}

  5. #5
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Major thanks Ralph!

  6. #6
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,746
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Sword Dancer View Post
    Major thanks Ralph!
    Sorry I should have checked those dropdowns for you.

    Reason why the dropdowns got centered as well is because all the <li>'s were selected in my code. Ralphs selects the dr opdowns and resets it.

    Just so you know, and next time you can apply that logic to problems elsewhere on your page .
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •