Viewport-Emulator im Firefox
bearbeitet von@@Sigrid
> In der [style-Version](https://codepen.io/Sig-rid/pen/wBMzQrp) steht der Text korrekt rechts,
>
> in der [anderen Version](https://codepen.io/Sig-rid/pen/xbZEQpx) 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 es durch das Script generiert.
Du müsstest die Stilangaben also für das richtige `div` machen, d.h. das durch das Script generierte:
```js
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
{:@en}
--
*“In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”*{:@en}
— Bruce Springsteen, Manchester 2025-05-14