Well I have no idea on how to make a navigation bar with descriptions and I want a navigation bar like that on my site. Can anyone give me the basic html and css for one? And I can style it myself.
There is one tutorial on the net at http://vikiworks.com/2008/03/29/a-cs...vigation-menu/, you don't need to copy the css and html files, and test it out, as the persons got a similar navigation with descriptions on the top of the page. However with this navigation, (this might be hard to explain) there's a header and a subheading on each link, but when you hover on only the heading the subheading doesn't going into a hover state, unless you're hovering over the subheading. Can someone give me a basic code of one where the header and subheading hover, so that the mouse pointer doesn't have to be directly on the subheading for everything to hover.
All help appreciated.

*bump* sorry but I need an answer quick, want to code it today.

That 'description' is nothing more than a <span> added into the <a> following the <a> inside the <li>.

hmmm I thought so, but what about the css? The guide on the link I posted, has the hover problem which I don't want. Any suggestions?

It's not a 'problem' it's the way the site owner intended it to be. There are different hover states applied to the <a> and to the <span> within the <a>.

lol I know it's the way it was intended to be, but for me it's a problem. And thanks I'll try that out now.

Just remove the additional hover state on span.

Well I did want you told me to, I'll just show you my css code so that you can see it for yourselves to help me fix it.

<div id="navigation">
<ul class="menu">
<li><a href="#">Homepage<br /><span>News & Updates</span></a></li>
<li><a href="#">Manga A-Z<br /><span>Latest & Greatest</span></a></li>
<li><a href="#">Forums<br /><span>Chat with fans</span></a></li>
<li><a href="#">Request Manga<br /><span>Request & Submit</span></a></li>
<li><a href="#">Submit Manga<br /><span>Help by submitting</span></a></li>
<li><a href="#">Contact Us<br /><span>For any help you need</span></a></li>
<li><a href="#">Faq/Help<br /><span>FAQ answered here</span></a></li>
</ul>
</div>

And this is my css

#navigation{
height:50px;
width:960px;
background:#000000;
border-right:1px solid #ffffff;
border-left:1px solid #ffffff;
border-bottom:1px solid #ffffff;
}

ul.menu {
margin:0;
padding:10px 20px;
}

ul.menu li {
display:block;
padding:0;
float:left;
text-align:left;
margin-right:30px;
}

ul.menu li a {
color:#fff;
font:bold 12px arial;
text-decoration:none;
line-height: 1.3em;
display:block;
}

ul.menu li a:hover {
color:#ffc300;
}

ul.menu li span { 
font:11px arial;
color:#666;
margin:0;
}

ul.menu li span:hover {
color:#999;
}

Well basically I removed
ul.menu li span:hover {
color:#999;
}
but that made the span text, the description, have no hover at all. I want it to hover aswell as the heading but I want it to hover as a whole so that even if the mouse pointer is directly on the heading the description will hover too. Anyone that can help me out with this? And please don't use really technical words, I'm a newbie to css and html. Thanks

Need a URL or ALL of your code, please.

erm k but as previously mentioned there are errors in the code still which I haven't had time to fix yet. Url is at mangastop.hoistoi.com/Index.php

Oh forgot I'm only testing out my new navigation code haven't uploaded it yet, I'll do that now.
Edit:done it, if you're wondering why the nav colours are odd, I haven't styled it yet, wanna sort this out first.

Anyone?

ok.. there's nothing there now but completely style-less page.

Oh sorry mispelt the link, thats what I get for not copying and pasting lol.
Correct link is http://mangastop.hostoi.com/Index.php
At this rate everyone on the site will hate me lol

Ok, make these changes to your CSS:

ul.menu li a:hover {
color:yellow; /*change to whatever color you want it to be on hover */
}

ul.menu li a span {
font:11px arial;
/*color:#999;*/ /*remove this*/
margin:0;
}
/*remove this section*/
/*ul.menu li span:hover {
color:#ccc;
}*/

hmmm not exactly what I wanted, sorry if I seem like I'm never happy. But here's a site to give you an example of what I want.
heartstation.org (a site for news on kingdom hearts, a game I like, if anyone is thinking wtf O.o)
The nav hovers as a whole but on this example the description lights up and the header stays the same. But if possible I want both the heading and desription to have hover states just need them to hover as one whole nav, not two different links. Sorry if I'm being a headache.
And the reason why I didn't want to copy and paste their code, one that's bad, and second, since I'm new to css and the code on that site is quiet complicated, I wouldn't be able to edit it.

You said you wanted the description to hover at the same time that you hovered over the main menu link.

It appears that you've already got it working in the same way your sample site does.