htmlcssshadowtext-shadow

How can i apply text-shadow on my text in css?

.text-shadow {
  text-shadow: 8px 12px 0px 0px rgba(0, 0, 0, 0.5);
}
<h1 class="text-shadow">hallo</h1>

it doesn't show a shadow and it also doesn't apply on the class

enter image description here

This is what the browser respond

can someone help me to fix the problem so the shadow work

I also tried it with filter: drop-shadow but it also doesn't work But other filters like blur work

Solution

  • Your text-shadow was incorrect.
    Text-shadow doesn't take 5 options.
    You should apply 2px 2px rgba(0, 0, 0, 0.5) or 2px 2px 2px rgba(0, 0, 0, 0.5).

    :offset-x | offset-y | blur-radius | color

    .text-shadow {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}
    <h1 class="text-shadow">hallo</h1>