Matinee: An Viewportbreite flexibel anpassende Zentrierung eines noscript-Hinweises

Beitrag lesen

Hallo,

ich habe einen noscript-Hinweis für die User, die JS deaktiviert haben.

Er erscheint mit position: absolute und z-index 9 "auf" dem header-Element, das position relative hat.

Der Hinweis sollte horizontal gesehen immer zentriert in der Mitte des header sein, dessen Breite desktop-first abnimmt. Der noscript-Hinweis selbst (zwei kurze Sätze, mit <br> getrennt) verändert seine Breite je nach Zeilenumbruch ebenfalls.

Mit folgendem Code, den mir die Google-KI liefert und der mir angesichts des von mir noch nie benutzten "transform" nichts sagt, scheint es zu klappen. Das heißt, der Hinweis bleibt immer horizontal zentriert, von desktop bis kleinem Smartphone, obwohl header und noscript beide ihre Breite ändern.

Kann ich den Code bedenkenlos so nehmen, funktioniert das zuverlässig in allen mobile- und desktop-Browsern?

header > noscript {
    position: absolute; 
    z-index: 9; 
    top: -3%;
    **left: 50%; 
    transform: translate(-50%);** 
    ...
    ...