Aligning line spacing following different font sizes on the same line

Now and again I like to start a sentence with a large capital, maybe
in a different font. This upsets the line spacing and I've failed to
find any css that will effectively crop the capital letter from the
bottom, to allow the line spacing of the following smaller font text
to remain unaffected. I've always had to resort to a graphic for the
leading capital - is there a way I can do this with css?

Thanks

John

John wrote:

Now and again I like to start a sentence with a large capital, maybe
in a different font. This upsets the line spacing and I've failed to
find any css that will effectively crop the capital letter from the
bottom, to allow the line spacing of the following smaller font text
to remain unaffected. I've always had to resort to a graphic for the
leading capital - is there a way I can do this with css?

I think you might want the first-letter pseudo-element:

http://www.w3.org/TR/CSS21/selector.html#first-letter

I'm not sure how well supported it is in browsers. You don't really want
to crop the letter (which to me means cut off part of it), do you?

Hey Paul - thanks - I think this is exactly what I want. The only
reason I mentioned cropping is that the leading capital when
highlighted showed white space below which I attributed to the font
itself, rather than its line spacing, so was seeking some way of
trimming it off. But the Pseudo thing does away with all that malarky
and seems just what I need - thanks again.

John


Paul <paultwoonesix (AT) blueyonder (DOT) couk> wrote

John wrote:
Now and again I like to start a sentence with a large capital, maybe
in a different font. This upsets the line spacing and I've failed to
find any css that will effectively crop the capital letter from the
bottom, to allow the line spacing of the following smaller font text
to remain unaffected. I've always had to resort to a graphic for the
leading capital - is there a way I can do this with css?


I think you might want the first-letter pseudo-element:

http://www.w3.org/TR/CSS21/selector.html#first-letter

I'm not sure how well supported it is in browsers. You don't really want
to crop the letter (which to me means cut off part of it), do you?