css menu tabs and <H1> tag

[traveller]

I'm trying to use the Chrome Menu bar (http://www.dynamicdrive.com/style/csslibrary/item/chrome-menu-bar/) but having a struggle - if I add H1 tags to the <li> items the menu 'breaks' and lists all the menu items vertically. Obviously this is about the standard H1 tag elsewhere in my css, but how can I write a bit of css that will modify the H1 tag ONLY when used in conjunction with <li> items from the menu?
I could use other defining properties other than a H1 tag obviously, but for SEO reasons my 'category' links should be H1's! :( I'm not very good (actually rubbish) at css so can someone suggest a definition that I can just cut and paste into the css and where to put it?

[forum_amnesiac]

The problem with H1 is that they give a carriage return at the end, starts a new line. If you are using H1 just for the font size, colour, etc then just define a class in your CSS file.

eg


td.menuheader {
font-size: 24pt;
font-family: Rockwell;
font-weight: normal;
padding: 0;
color: #060F35;
}
Then use
<td class="menuheader">My Title</td>

[traveller]

But it isn't the font 'properties' that's the reason I want to use the H1 tag - its the extra weight attached to that word in terms of search engine optimisation. 'Junior' page links on my site are only defined by the class of the text, but Top Level 'category' links (which is what I want to use this menu for) are supposed to be H1. I must be able to 'adjust' the properties of H1 tags when in an unordered list to avoid the line return and use a smaller font size, but I just can't see how to do it?

[bluewalrus]

Are you using h1's else where in your code?

If not I think this should do it...


h1 {
padding:0;
margin:0;
display:inline;
}

If you are just give it a class and then use that again with the class only

[traveller]

Yeah, I've got other <H1>s elsewhere in the text, but you pointed me in the right direction! A little modification, and:


.h1_mainlinks {
padding:0;
margin:0;
FONT-SIZE: 12px;
COLOR: #000000;
display: inline;
}
followed by

<div class="shadetabs">

<ul>

<li class="selected"><a href="http://www.dynamicdrive.com/"><h1 class="h1_mainlinks">blah blah</H1></a></li>
<li><a href="http://www.dynamicdrive.com/style/"><h1 class="h1_mainlinks">more blah</H1></a></li>
</ul>
</div>
does the trick nice! Many thanks