What would be the best way to creat my navigation?

Hey guys,

Im having a bit of trouble on my current commision site. I need to create the top navigation, but Im honestly not sure how to do it. I do not want to have them as images i want them to be plain text links (i.e the subnav links) but Im not sure how to place them there. Is there a way to do it using CSS or a div? just so you have an idea here is the link:

http://www.playersnmotion.com/main_site

you can see the links across the top are not clickable, that whole section from the banner to the link bar is one image, I tried placing the image as the TD background, but it completely messes up the page. I would like the links to be placed and spaced the same way they are in the image. If any of that made sense to you please help!!!

I would do it like this:

Thanks DM! now is there a simpler way to line up the links as I shown on the site, without having to insert a bunch of < br > and &nbsp? because right now the links are at the top left, i need them to sart bottom left. Thanks.

CSS:
on the TD, vertical-align:bottom

on the links, padding:5px

will send them to the bottom and space them, the links shouls end up 5px from the bottom and sides, 10px from each other.

If a user uses text-zoom the links should expand over the title and not mess up the layout too much.

Im havent really used CSS. how would you write out that code please?

in the head:


<-- Check it


then create a file called style.css and save in the / folder (probably will be www/ )

then in style.css:



You should also have a valid doctype else IE <i>might</i> throw a wobbly on you.

Then got to http://www.w3schools.com and click on the css tutorial and learn

lol I started learning yesterday as a matter of fact . Thanks rtm I got it more or less how i want it. Ill figure the rest out. Thanks both of you :d

just out of curiosity, did you need the display block and float?

ummm.....to be truly honest I have absolutly no idea what it means. So i left it in there . Your code didnt work for me though. Im not sure why. I already had a link to an external stylesheet and i placed it in there. i posted a link to the webpage in my opening topic, would u take a look for me and tell me what I am missing?

I'm really not sure....

You have got a lot of overlapping tags, which need to be sorted out - they can cause all sorts of funkdoobieness because different browsers will do different things with them. I would definately start by losing all of those <br>'s and &nbsp;'s

ok I got rid of all the break and space tags. Now all i gotta do is get your code to work and I'm all set

Is the div supposed to contain the links or not?

If it is we are in poo. I'll have to think about it lol. Sorry this is messing you about a bit.

Can you also sort out the overlapping tags:


the div and center need sorting out, and the strong needs to be closed.

I think I know how to sort it out now, but I'm gonna have to think about it.

ok rtm, take a look at it now . I know i need to clean up my code a bit but that should be about it! does it show up any different in mozilla?

//edit: You should see a centered webpage with the top links just slightly to bottom left of the link bg. basically a smooth webpage. I had to add some align codes in my style sheet Thanks for getting me started!

And I thought we were going to be messing around for another half hour - looks fine in FIrefox, mozilla netscape and internet explorer. Even looks good on opera




Sorry, I just noticed, the links look right on all browsers, but the main page is slightly skewed by about 5px. I barely noticed it. Your best bet is to get a copy of firefox and see for yourself.

This is a minor problem, and it's a <b>table</b> problem methinks, so I probably won't be able to sort that one for you.

NP tables I can handle. Thanks rtm