initial-letter is a CSS property that selects the first letter of the element where it is applied and specifies the number of lines the letter occupies.
The initial-letter CSS property is part of the CSS Fragmentation Module and is used to style drop caps—those large decorative letters at the beginning of a paragraph often seen in books, magazines, or newspapers.
🔍 What Does initial-letter Do? It allows you to control:
1. Size of the first letter (in terms of lines it spans)
2. Number of letters to style (usually just one)
3. Alignment with the surrounding text
🧪 Browser Support
⚠️ Limited support: As of now, initial-letter is supported in Safari and partially in Chrome (behind flags). It’s not widely supported in Firefox or Edge yet.
For broader compatibility, developers often use a combination of ::first-letter and manual styling (like font-size, float, and line-height) to simulate drop caps.
🔔 Subscribe for more videos like this : https://www.youtube.com/c/CodeCanvas?sub_confirmation=1
#css3 #css #csstricks
