You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
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.
The text was updated successfully, but these errors were encountered:
@r12a For this use case, would text-transform: capitalize or a new text-transform: capitalize-first value work, or are there use cases that involve other aspects of styling?
text-transform: capitalize doesn't work well — in fact, that's what i initially used, but it looked horrible, producing far too much capitalisation (such as 'At'), and destroying the semantics where, for example, lowercase 'factory' implies a generic use of the word rather than part of a name — it was actually called the 'Soho Manufactory', rather than the 'Soho Factory'.
Something like text-transform: capitalize-first might work. I don't know what the pros and cons would be.
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.
The text was updated successfully, but these errors were encountered: