css question - re styling the bold tag

ok...lets say one of the cells in my html table has the class: cell4

and the css definition is:

.cell4 {
background: #FFFFFF;
padding: 5px;
font: 11px Arial, Helvetica, sans-serif;
}

Lets say I want all of the <b> tags in this cell to be navy blue, 12 pt...

How can I set the b tag to only affect this cell?

If I use:

b {
font: bold 12px Arial, Helvetica, sans-serif;
color: #000066;
}


It works, but all of the bold tags in the other cells on the page turn blue too

any ideas?

 

Target by the class

.cell4 b {
font: bold 12px Arial, Helvetica, sans-serif;
color: #000066;
}

one of the most important features of CSS is the abiltity to group a bunch of tags under one class or ID, then target them by the wrapper instead of slapping classes on each and every tag.

You see it in menus all the time where people will go:

<ul>
	<li class="lineItem">Item 1</li>
	<li class="lineItem">Item 2</li>
	<li class="lineItem">Item 3</li>
	<li class="lineItem">Item 4</li>
</ul>

Code (markup):

to target each li with ".lineItem", when it would be faster to go:

<ul class="lineItems">
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
	<li>Item 4</li>
</ul>

Code (markup):

to target those as ".lineItems li"

 

thanks got it now