Please, help about Drop Caps? (dropcap)

[efthymis]

Hello everyone!

I searched this forum for mentions of “drop cap” and “dropcap” and I can’t find anything relevant, so I am sorry I’m bothering you with this.

I have a big paragraph bric with lots of text. Actually it’s the first chapter of a book.

What I am trying to achieve is have the first letter of each paragraph in the paragraph bric to be a drop cap. I have also searched for drop caps online, and there are several ways to get it via CSS, but when I copied the css code in the Code Editor and tried to invoke the class on a Span-Wrapped letter, the class doesn’t even show as available.

In any case, to avoid confusion: I would like to create drop caps in a big body of text (circled letters in the screenshot).

[AdamNotEve]

Hi, is this what you are looking for? Blocs Academy - How to Style the First Letter

[efthymis]

@AdamNotEve thanks for the reply!

Unfortunately, that method styles-up only the first letter of the whole body of text.

I was hoping for something like this:

where ALL first letters are each one in its own span, then apply this formatting to the span. It would involve both enlarging the font, but also format the area around it

[Bill]

You just need some additional settings for the dropcap (adjust margins and font size as desired):

Have fun.

Bill
BricsDesign

[PeteSharp]

I mentioned this to Norm a while back also.

There is a difference between a pseudo class and a pseudo element. Hence they adopted using : and ::

It should be

::first-letter

Browsers are smart and will recognise it, but there are standards for a reason

::first-letter - CSS: Cascading Style Sheets | MDN

[Norm]

You could just split the text into separate paragraphs and apply the class to each. There is a split text button when you highlight chunks of text.