Coding for navigational menus?

New Coder:Need help writing coding for navigational menus - like About US, Contact, Products.
Please show some coding example here.

 

How do you want your menu? Vertical, horizontal, colors, hover...

 

on left vertically with color and hoover, if possible?

ABOUT US
CONTACT
PRODUCT 1
PRODUCT 2
and so on...

 

I would suggest something like:

HTML file:

<div id="leftMenu">
<ul>
<li>ABOUT US</li>
<li>CONTACT</li>
<li>PRODUCT 1</li>
<li>PRODUCT 2</li>
</ul>
</div>

Code (markup):

CSS file:

div#leftmenu ul
{
 /* the style you want*/
}

div#leftmenu li
{
 /* the style you want*/
}

Code (markup):

 

Thanks a lot. I have done html coding but for css coding where do I place css coding to get that effect or it has to be in a separate file. By the way, website is not yet hosted.

 

The css or the link to css file has to be placed just above the </head> tag. Do a "view source" on any website for examples.

 

You can actually strip the DIV container, and put the styles on the list itself (after you move the ID from the DIV to the UL element, of course).

tptnyc, have you looked at www.alistapart.com by any chance? ALA has some articles on CSS that you'll want to look at. Most of them use more code than necessary (since they try to cater the code they write to cover as many situations and skill levels as possible), but they should still be usable to you as is. Just try to avoid using positioning and use floats and margins instead.