From 898a6182470ee0fd8f182dbe36249d88ab36c797 Mon Sep 17 00:00:00 2001
From: Benoit Bovy <benbovy@gmail.com>
Date: Tue, 12 Nov 2024 13:45:33 +0100
Subject: [PATCH] fix html repr indexes section

---
 xarray/core/formatting_html.py | 4 +++-
 xarray/static/css/style.css    | 1 +
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/xarray/core/formatting_html.py b/xarray/core/formatting_html.py
index d0cb7c30e91..e6ae7d77dc6 100644
--- a/xarray/core/formatting_html.py
+++ b/xarray/core/formatting_html.py
@@ -155,7 +155,9 @@ def summarize_index(coord_names, index) -> str:
     return (
         f"<div class='xr-index-name'><div>{name}</div></div>"
         f"<div class='xr-index-preview'>{preview}</div>"
-        f"<div></div>"
+        # need empty input + label here to conform to the fixed CSS grid layout
+        f"<input type='checkbox' disabled/>"
+        f"<label></label>"
         f"<input id='{index_id}' class='xr-index-data-in' type='checkbox'/>"
         f"<label for='{index_id}' title='Show/Hide index repr'>{data_icon}</label>"
         f"<div class='xr-index-data'>{details}</div>"
diff --git a/xarray/static/css/style.css b/xarray/static/css/style.css
index d4f5c104850..b1cefeb2af9 100644
--- a/xarray/static/css/style.css
+++ b/xarray/static/css/style.css
@@ -75,6 +75,7 @@ body.vscode-dark {
 .xr-section-item input {
   display: inline-block;
   opacity: 0;
+  height: 0;
 }
 
 .xr-section-item input + label {