Embedded Style Inside Of Body?

Everything I have ever seen written about using embedded stylesheets says that it has to be used within the head tag.

But I just saw one website that is using embedded stylesheets within the body. It looks like some sort of CMS is putting embedded styles within the body just before the HTML it styles conditionally based on whether or not some feature is enabled. There were at least two sections in the body where there was an embedded stylesheet followed by HTML it styled.

Is this an acceptable use of embedded styles? It seems to work fine. If this is acceptable, I wonder why I have read nothing about it before.

It’s invalid acording to the specs as the style element should only be in the head of the document and therefore should not be used elsewhere.

However it does seem to work everywhere but that still doesn’t mean that it should be used or guaranteed to work forever. It’s probably more a case of a quick and dirty CMS fix rather than doing the job properly in the first place.

The only time I would use style tags in the body section is when coding email templates because stylesheets are less likely to be stripped by the email client when found in the body.


Stevie types quicker than me and more or less said the same thing :slight_smile:

According to w3.org (and they should know!), the <style> element is only allowed within the <head>.

While it probably does work on most current browsers, because they’re a pretty forgiving bunch and will have a good go at trying to display what you meant rather than what you actually told them to do. But if you try it in XHTML then you’ll just get a YSOD and that isn’t going to look good. And who knows, maybe the next version of Firefox will take a stricter line and will ignore any <style> element within the <body> … is that a risk worth taking, when you can just as easily include it in the <head>?