diff --git a/css/style.css b/css/style.css index b8aa842..464084a 100644 --- a/css/style.css +++ b/css/style.css @@ -786,7 +786,9 @@ input[type="range"]::-webkit-slider-thumb { table header) offsets by --hdr-h. */ .content-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; - /* Height of the batch bar — reserved even when nothing is selected. */ + /* Height of the batch bar — reserved even when nothing is selected, so + selecting something never moves the grid. .batch-bar pins itself to the + same value; change both together. */ min-height: 38px; position: sticky; top: 0; z-index: 12; background: var(--bg); @@ -996,8 +998,13 @@ input[type="range"]::-webkit-slider-thumb { .batch-bar { flex: 1; align-self: center; + /* EXACTLY the height .content-header reserves. Left to grow, the bar was a + few pixels taller than the reservation and pushed the whole grid down as + soon as anything was selected — the shift the sticky header was meant to + prevent in the first place. */ + height: 38px; display: flex; align-items: center; gap: 8px; - padding: 5px 10px; + padding: 0 10px; background: var(--bg-elev); border: 1px solid var(--accent); border-radius: var(--radius);