Css ::first-letter on textarea does not work

Question

I want to make every first letter typed in a textarea be uppercase. But when I try this code, it doesn't work:

textarea::first-letter {
  text-transform: uppercase;
}

<textarea name="content" rows="18" placeholder="Your Message" title="Give Your Advice To Us" wrap="soft"></textarea>

How can I fix this?

Answer 1

You need a block container in order to use the ::first-letter pseudo-element:

p::first-letter {
  text-transform: uppercase;
}

<p>
  <textarea name="content" rows="18" placeholder="Your Message" title="Give Your Advice To Us" wrap="soft"></textarea>
</p>