From e05e85cc2c4d084d0689749c3672704caea7d59f Mon Sep 17 00:00:00 2001
From: Pierre DE SOYRES <pierre.de-soyres@clever-cloud.com>
Date: Thu, 10 Oct 2024 18:01:35 +0200
Subject: [PATCH] fix: fix `visually-hidden` style to prevent a strange bug in
 Chrome

Fixes #1200
---
 src/styles/accessibility.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/styles/accessibility.js b/src/styles/accessibility.js
index b362a1891..939563472 100644
--- a/src/styles/accessibility.js
+++ b/src/styles/accessibility.js
@@ -3,12 +3,13 @@ import { css } from 'lit';
 // language=CSS
 export const accessibilityStyles = css`
   .visually-hidden {
-    position: absolute;
-    overflow: hidden;
-    width: 1px;
-    height: 1px;
     clip: rect(0 0 0 0);
     clip-path: inset(50%);
+    height: 1px;
+    overflow: hidden;
+    position: absolute;
+    top: 0; /* this fixes a bug in Chrome when this style is used into a grid element (and has overflow) */
     white-space: nowrap;
+    width: 1px;
   }
 `;