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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    menu bar - wont center inline

    ok, i think im crazy but either i get the ul inline, or centered, never both. any suggestions
    style portion
    Code:
    #mainnav {
     position:absolute; 
     text-align:center;
     width: 80%;
     background: #1f395a;
     top:100px; 
     left:10%;
     border-style:solid;
     border-color: transparent transparent #a0aec1;
     border-width: 0 1px 4px;
     }
     
    
    #mainnav ul {
     margin: 0 auto;
     padding: 0;
     list-style: none;
     text-align:center;
     }
     
    #mainnav li { 
    display: inline; 
     }
    
    #mainnav a {
     text-decoration: none;
     display: block; 
     border-style: solid;
     border-color: transparent transparent #a0aec1;
     border-width: 0 1px 4px;
     padding: 6px 15px 3px;
     color: #fff;
     font-weight: bold; 
     font-size: 75%;
     }
    and html

    Code:
    <ul id="mainnav">
    	<li><a href="index.html">Home</a></li>
           	<li><a href="about.html">About Us</a></li>
       	 	<li><a href="services.html">Services</a></li>
           	<li><a href="contact.html">Contact</a> </li>
    </ul>
    and there are going to be more items in the li

    Thanks in advance
    Last edited by mjbasford; 06-08-2010 at 11:26 PM. Reason: resolved

  • #2
    New Coder
    Join Date
    Jun 2010
    Posts
    16
    Thanks
    0
    Thanked 2 Times in 2 Posts
    The text-align will just center the text inside the element if I'm not mistaken. I would place inside a <div> and center that using left and right auto margins.

  • #3
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    still cant get it to work then. I think i have some element of the style that cancels out to center maybe?

  • #4
    New Coder
    Join Date
    May 2010
    Location
    Midwest, USA
    Posts
    11
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Try removing display:block; from #mainnav a

  • #5
    New to the CF scene
    Join Date
    Jun 2010
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Worked! thank you, i knew it was something stupid like that and ive been killing myself the last two nights trying to figure this one out.


  •  

    Posting Permissions

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