How to define CSS styles if Javascript is turned off? [duplicate]

Question

Possible Duplicate:
Embedding extra styles with noscript
Define css if javascript is not enabled

I am trying to define specific CSS styles only if Javascript is turned off. I am using:

<noscript>
    <style type="text/css">
    .needjs {display:none !important;}
    .mwnojs { margin-top: 40px !important; }
    </style>
</noscript>

When trying to validate the page source, I get the error "Element style not allowed as child of element noscript in this context".

So, how would I go about doing this while keeping my markup valid?

Answer 1

<noscript> tags are "body" tags and <style> tags are "head" tags. Therefor you get an error.

You should make non-javascript style default and then use js to change your style. See here for more details: https://stackoverflow.com/a/218917/1068167

Answer 2

Seems very similar to this question

"To clear up the validation issue: noscript is only allowed in the body element, style only allowed in the head. Therefore, the latter is not allowed within the former."

It might matter where your <noscript> tag is located.