JS funktioniert nicht - wer kann helfen?

Hallo liebe Gemeinde,

Ich möchte gerne die CSS eines DIV-IDs (+ 2 geplante weitere), bzw. einer Klasse verändern, wenn der eine Breite von <800px erreicht hat.
Den Code habe ich mir durch tagelanges googlen gesucht, verglichen und erlesen, so daß ich meine, an sich das richtige gefunden zu haben. Da ich in JS aber (noch) Anfänger bin, kome ich nicht auf den Fehler…

Wer kann mir helfen oder kennt eine bessere Lösung???
Hier der Code:

<head>
...
<script language="JavaScript" type="text/JavaScript">
    window = function(){
    var x = document.getElementById('inhalt').offsetWidth;
    document.getElementById('x').innerHTML = x;
    if ('x' < 800) {
    $('#sh').css('position','relative' !important);
    } }
</ script>    // Leerzeichen zur W-W-W-Darstellung beabsichtigt!
...
</ head>    // Leerzeichen zur W-W-W-Darstellung beabsichtigt!
< body id="inhalt">    // Leerzeichen zur W-W-W-Darstellung beabsichtigt!
...
< div id="sh">    // Leerzeichen zur W-W-W-Darstellung beabsichtigt!
...
</div>
</body>

LG Baerchen

Muss es denn unbedingt in JS sein?
Mach es doch direkt in die CSS:

@media screen and (max-width: 800px) {
#sh{css}
}

@media screen and (min-width: 801px) {
#sh{css}
}

Nö, muss es nicht…

…oder kennt eine bessere Lösung???

Dieses Media Queries ist ja viel besser… )und ich hatte mich schon ab und an gefragt, was diese immer häufiger vorkommenden „@“ in Quell-Codes zu suchen haben)

und bedient auch die letzten 0,8% User
dazu eine Zeile schlank und somit ein paar B weniger Traffic - Kurz und gut:

Danke für den Code… hab mich damit heute Nachmittag beschäftigt, wieder was dazu gelernt, und easy auf meinen Code umgesetzt & eingepasst!

Problem gelöst !
LG Baerchen