text size dependicies

having problems with this

[macrost]

I have a td that has an id selector on it. Within this td, I'm trying to have a div that has text within it set to a larger font size. The problem is that whatever the largest font size is in either the id or the class, is what the font size is going to be. I hope I have explained this correctly!

Here's a little snippet of the relevant code:

td#navbar{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
background-image: url(images/navbarbg.gif);
}
.login{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
color:white;
margin-left:40px;
display:inline;
}

Then I have this:
<tr>
<td id="navbar" colspan="2">asdf<div class="login">needs to be larger</div></td>
</tr>

[photon]

My guess would be that it has to do with specificity.

td#navbar

is more specific than

.login

, so it overrides the .login div.

If however, you're saying that when you switch the font sizes it still shows the larger one, then I have no clue. :)

[macrost]

<deleted per being stupid>

I looked at the stuff again, and photon, you are correct. The td#navbar is more specific then the class login. So anything in navbar is overriding the login class. Is there a way that I can have this seperated?
Thanks!

[iamlost]

I must be missing something -

I ran your code as given (adding only <table></table>) and it displayed correctly in IE, Firefox and Opera on win98se.

I switched font-sizes and the font sizes switched correctly.

What am I doing right/wrong?
Have you run it exactly as posted or is there some other code that might be an influence?
Which browser(s)/OS have you had the prob show up in?

[encyclo]

Have you tried getting really specific with your rule?

td#navbar .login {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
color:white;
margin-left:40px;
display:inline;
}

This may be awkward, however, if you are reusing the

.login

style elsewhere outside of the navbar td.

[macrost]

iamlost,
There really isn't much more to it, here's the rest of the css that I'm running for that particular section.
td#navbar{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
background-image: url(images/navbarbg.gif);
}

td#navbar a{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:white;
text-decoration:none;
text-indent:30px;
}

td#navbar a:hover{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:yellow;
text-decoration:none;
}

.login{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:white;
margin-left:40px;
display:inline;
background-image: url(images/navbarbg.gif);
}

.login a{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:white;
display:inline;
}

.login a:hover{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
color:yellow;
text-decoration:none;
display:inline;
}

encyclo,
I'm going to try what you have.