Below is the CSS code to create drop caps (or dropped initials) for Blogger templates. I have tested it on Firefox, Chrome, Edge, Internet Explorer, Opera and Safari and verified that it looks the same on all those browsers.
The above code targets the first letter of the first paragraph of every article in a blog, specifying its font face, font size, alignment, line height and margins. In order for it to work, paragraphs must be properly wrapped with opening and closing paragraph tags (<p> ... </p>).
Using Georgia font, a font-size value of 550% creates a drop cap that is 3 lines tall, while a value of 330% makes it 2 lines tall. Using a different font could require adjusting the line-height and margin settings.
To use it, just insert it into your existing stylesheet, or just wrap it with opening and closing style tags (<style> ... </style>) and drop it just before the closing head tag (</head>) of your HTML. Again, it will only work if your paragraphs are properly wrapped with opening and closing paragraph tags. Try it!