Current location: Hot Scripts Forums » General Web Coding » CSS » ul just won't center!


ul just won't center!

Reply
  #1 (permalink)  
Old 03-05-11, 06:51 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
Rolleyes ul just won't center!

Ok so I've been searching around the web and trying out a few solutions but not having any luck So I'm hoping someone here can show me a good way to do this. Basically I just want my navigation in the center rather than left aligned.

HTML
HTML Code:
                <div id="nav">
                <ul>
                        <li>
                        <a href="index.php">Home</a>
                        </li>

                        <li>
                        <a href="index.php?page=sites">Websites</a>
                        </li>

                        <li>
                        <a href="index.php?page=games">Games</a>
                        </li>
                                
                        <li>
                        <a href="index.php?page=other">Other Projects</a>
                        </li>
                                
                        <li>
                        <a href="index.php?page=about">About</a>
                        </li>
                                
                        <li>
                        <a href="index.php?page=contact">Contact</a>
                        </li>

                </ul>
                </div>

CSS
HTML Code:
#nav{

        background-image: url(images/link.png);
        height: 26px;

}

#nav ul{

text-align: center;

}

#nav li{

        list-style: none;
        float: left;
        height: 26px;
display: inline;

}

#nav a{

        color: #FFFFFF;
        text-decoration: none;
        display: block;
        padding: 6px;

}

#nav a:hover{

        color: #000000;
        text-decoration: none;
        cursor: pointer;

}


Thanks for your time.
Reply With Quote
  #2 (permalink)  
Old 03-05-11, 07:08 PM
_matt1313 _matt1313 is offline
Newbie Coder
 
Join Date: Dec 2010
Posts: 12
Thanks: 0
Thanked 1 Time in 1 Post
try this

Code:
#nav {
	background-image: url(images/link.png);
	height: 26px;
}
#nav ul {
	list-style-type: none;
	text-align: center;
}
#nav li {
	list-style: none;
	height: 26px;
	display: inline;
}
#nav a {
	color: #000;
	text-decoration: none;
	padding: 6px;
}
#nav a:hover {
	color: #000000;
	text-decoration: none;
	cursor: pointer;
}
Reply With Quote
The Following User Says Thank You to _matt1313 For This Useful Post:
FireflyX (03-05-11)
  #3 (permalink)  
Old 03-05-11, 07:20 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
No change

Cept you turned my links black
Reply With Quote
  #4 (permalink)  
Old 03-05-11, 07:33 PM
_matt1313 _matt1313 is offline
Newbie Coder
 
Join Date: Dec 2010
Posts: 12
Thanks: 0
Thanked 1 Time in 1 Post
what browser are you using as this worked in FF
Reply With Quote
  #5 (permalink)  
Old 03-05-11, 08:03 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
Yeh I'm using FF too. Unfortunately I don't have the site live atm or I could have sent you the link...
Reply With Quote
  #6 (permalink)  
Old 03-05-11, 08:49 PM
_matt1313 _matt1313 is offline
Newbie Coder
 
Join Date: Dec 2010
Posts: 12
Thanks: 0
Thanked 1 Time in 1 Post
this is how I see it. Look at attachment
Attached Images
File Type: jpg Capture.jpg (6.7 KB, 79 views)
Reply With Quote
  #7 (permalink)  
Old 03-05-11, 09:00 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
Ok I just tried that bit code on its own page and it worked fine I guess I must have something else in the css file that's causing it to mess up.
Reply With Quote
  #8 (permalink)  
Old 03-05-11, 09:01 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
Code:
*{

        margin: 0;
        padding: 0;
        border: 0;

}


body{

        margin: 25px;
        background-color: #F0F0F0;
        background-image: url(images/bg.png);
        background-repeat: repeat-x;
        font-family: verdana;
        font-size: 12px;
        color: #919191;

}

#container{

        text-align: left;
        width: 775px;
        margin: auto;


}

#banner{

        height: 80px;
        background-image: url(images/banner.png);

}
That's everything that appears before the #nav
Reply With Quote
  #9 (permalink)  
Old 03-05-11, 09:10 PM
_matt1313 _matt1313 is offline
Newbie Coder
 
Join Date: Dec 2010
Posts: 12
Thanks: 0
Thanked 1 Time in 1 Post
the border is on the #nav

everything looks good
Attached Images
File Type: jpg Captur1e.jpg (5.0 KB, 74 views)
Reply With Quote
  #10 (permalink)  
Old 03-05-11, 09:13 PM
FireflyX's Avatar
FireflyX FireflyX is offline
Newbie Coder
 
Join Date: Nov 2009
Location: Stockton, UK
Posts: 37
Thanks: 8
Thanked 0 Times in 0 Posts
I'm going to start deleting other stuff off the page and see if that helps. It works fine when I put it on it's own but there's something on that page screwing it up
Reply With Quote
Reply

Bookmarks


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Final sidebar editing problems grlTrifecta CSS 3 04-07-10 01:10 PM
css problem with the scroll bar crazy.works CSS 0 11-04-08 05:34 PM
Website not showing for all IE users xavier039 CSS 7 08-14-08 05:58 AM
css help (very simple i think) jcoxy4 CSS 2 06-11-07 02:32 PM


All times are GMT -5. The time now is 04:45 PM.
vBulletin® Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.