CODEWITHSUNDEEP
htmlcss
SomeOneSomewhere
SomeOneSomewhere

Reputation: 3

Why isn’t the text-shadow CSS property working here?

I am trying to apply a nice text shadow to two words, but it seems that the CSS isn’t doing anything. See this jsFiddle.

<p id="np">Nakshatro Production</p>

#np {
    text-shadow: -0px 0px 1px 0 hsl(20, 100%, 16%),
                 -2px 2px 2px -1px hsl(20, 100%, 14%),
                 -4px 4px 2px -2px hsl(20, 100%, 12%),
                 -6px 6px 3px -3px hsl(20, 100%, 10%),
                 -8px 8px 2px -4px hsl(20, 100%, 8%),
                 -10px 10px 2px -5px hsl(20, 100%, 6%);
}

Upvotes: 0

Views: 1946

Answers (2)

SamDJava
SamDJava

Reputation: 267

http://www.w3schools.com/cssref/css3_pr_text-shadow.asp. You have given an extra data which is not accepted.

#np{

text-shadow: -12px 2px 2px hsl(120,70%,50%),
     2px 12px 2px hsl(120,30%,20%),
      -2px 2px 12px  hsl(120,100%,50%);  
}

Try this and I think you will have some idea.

ALso modified ur fiddle http://jsfiddle.net/jct0vf0z/4/

Upvotes: 0

Ry-
Ry-

Reputation: 225263

Unlike box-shadow, text-shadow doesn’t support a spread value; you can only select offset and blur. That is, use a maximum of three size values and one colour. jsFiddle, not quite the same.

Upvotes: 2

Related Questions