@@Sigrid

In der style-Version steht der Text korrekt rechts,

in der anderen Version steht er links.

Was ist hierfür die Ursache?

Das Entwicklertool ist zu mehr gut als die Breite des Viewports zu ändern und dessen Größe anzuzeigen. Mal einen Blick reingeworfen:

Du siehst, dass das div-Element, für das du die Stilangaben gemacht hast, nicht dasjenige ist, in welchem die Viewportgröße steht. Kann ja auch gar nicht; das div mit der Viewportgröße steht ja gar nicht im Markup, sondern wird durch das Script generiert.

Du müsstest die Stilangaben also für das richtige div machen, d.h. für das durch das Script generierte:

	document.body.insertAdjacentHTML(
		"afterbegin",
		'<div id="js-viewport-anzeiger" style="…">Warte auf Resize-Event...</div>'
	);

Und das div im Markup brauchst du nicht; es macht keinen Sinn, das script in ein div zu packen.

🖖 Live long and prosper