[css-text] Make first-letter work with inline text
Nobody has claimed this yet.
- Dominant language
- Bikeshed
- Stars
- 4.9k
- Forks
- 816
- PR merge metrics
- PR metrics pending
Description
It's currently possible to use ::first-letter only with block elements. It would be useful to make it work for inline elements, too.
Example use case:
I've been developing an app to take information from a json database about family history and display it. The occupation of Thomas Lakelin is stored as the string "silversmith at Matthew Boulton's Soho factory". When displayed in the auto-generated summary (#1) no change is needed. In the key points column (#2), the initial letter is uppercased using ::first-letter, no problem. But at the top of the page (#3) i want to use the same string in an inline context, but still uppercase the first letter. To do so, i would need to resort to scripting. It would be much cleaner if i could simply apply ::first-letter to the markup around that piece of text.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reviewing the current ::first-letter behavior described in the issue and compare it with the inline-text example. Define how the feature should apply in inline contexts, then document the expected behavior and verify that the proposed change covers the displayed use case.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100