CSS: drop-cap problem?

[web88js]

Hello eveyone:

I have this problem to get first letter in different paragraph change color.

my approach is to define a class selector in which I defined font-family, font-weight and color attribue

then I used a contextual selector to modify a character in another paragraph to make it Drop-Cap.


#body_txt .firstChar
{
float: left;
font-size: 360%;
line-height: 0.8;
}

.firstChar {color: #ffcc00;
font-family: herculanum, papyrus, harrington, 'zapf chancery', 'apple chancery', impact, sans-serif;}

I got Drop-cap effect working but I wasn't able to change first characters in 3 separate paragraph enclosed in <div id="ingredients">tag.

I couldn't figure out what went wrong here. Please have me trouble this CSS issue. Thanks!

URL: http://www.cuj06.com/html/chocolate.html

Jeff
10-24-06

[Wickham]

If you want a class to apply to several ids, alter the css style from #body_txt .firstChar
to just
.firstChar

or add
#ingredients .firstChar {
float: left;
font-size: 360%;
line-height: 0.8;}

Note that there needs to be a gap between #ingredients and .firstChar

The html is OK because you have <div id="ingredients"> and then class="firstChar" inside a span tag just for the first letter.