: Adding text shadow to your whole website I want to add shadow to all the text into a website. The text is in different elements of the website. Now I was thinking of 2 things. 1) add a

@Candy875

Don't apply it to a bunch of elements individually; just set it at the top and the shadow will apply to all contained text.

body { text-shadow:1px 1px 1px rgba(51, 69, 78, 0.5); }


(If it didn't work this way, then there would be lots of inconveniences from document structure, such as if you specified a shadow on a paragraph which contained a link.)

Vote Up Vote Down

@Angie530

If this is going to apply to all text, you just need to start with:

body, input, textarea, select {
text-shadow : 1px 1px 1px rgba(51, 69, 78, 0.5);
}


On testing, you might need to add one or two other elements for total coverage. For example, note that some form elements had to be included explicitly; they're annoying like that. Also remember this is not going to apply to anything that's not actually in the document, like iframes.

If you really want to cheat, you can just apply the property to the universal selector:

* {
text-shadow : 1px 1px 1px rgba(51, 69, 78, 0.5);
}


But given some findings about that being inefficient(it gets applied to every single thing on the page) and the type of processing involved in creating things like shadows, it might not be a great idea.

Vote Up Vote Down

@Alves908

IMO you should not create a specific class just for text-shadow. That's like adding presentation back into the document. text-shadow should be added to those elements (or predefined classes) that require it. So, of your two options, #2 would be my recommendation, although I would have said you should only be adding it to a subset of predefined classes. And not all elements/classes would require the same type of shadow.

Do you really want to add text-shadow to every bit of textual content?! Large blocks of text should not have text-shadow applied in my opinion. This could make the text harder to read and hence cause some accessibility issues.

Vote Up Vote Down