The Drop Cap can be close to the size of the title text or bigger. We are trying various font-sizes and adjusting the height as needed. The result is nearly identical to the magazine dropcap or a drop cap we see in our favorite novels.

For this one we want to force the first big letter to span about five lines. The font-size is adjusted to exactly 100 pixels while the line height is 70 pixels. We tried a line-height of 80 but that leaves a little too much white space. And you really do need to see this with enough text to let the initial capital letter enhance the text rather than dominate the text.

Copy and paste this in your Blog or Web page.

It will look like this.

For this one we want to force the first big letter to span about five lines. The font-size is adjusted to exactly 100 pixels while the line height is 70 pixels. We tried a line-height of 80 but that leaves a little too much white space.

Drop Cap 36pt

The first letter in this paragraph is big. Magazines use the drop cap technique and CSS includes the first-letter pseudo class, but we want more control so we are using a span to make it big. In all fairness to the paragraph itself we probably should type enough to see how it looks when it is surrounded by its textual friends by using more words.

In our browser the top of the first letter is parallel with the rest of the text on the first line. That was the goal, to drop the cap for top vertical alignment. Your mileage may vary.

In the magazine they indent each line after drop cap, maybe that's where they get the balance. So we are using text-indent:20px; which may mimic magazine style more closely.

Copy and paste this in your Blog or Web page.

It will look like this.

The first letter in this paragraph is big. We used a font size of 36pt. You can change the font size and adjust the height as needed. It wasn't easy to decide between 22pt and 24pt height. Depending on your font it will probably need some adjustment.

Or this if you use a line height of 22pt.

The first letter in this paragraph is big. We used a font size of 36pt. You can change the font size and adjust the height as needed. It wasn't easy to decide between 22pt and 24pt height. Depending on your font it will probably need some adjustment. more about drop caps...