From a29c5aa657b4ba2e41d54f8265603b8c500a3c8b Mon Sep 17 00:00:00 2001 From: Lukas Wallrich Date: Thu, 25 Jun 2026 11:07:42 +0100 Subject: [PATCH] Fix steering-committee card misalignment: drop 1px border (#808) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Member cards (.sc-card) had `border: 1px solid transparent` while title cards (.sc-title-card) had `border: 0`. With `box-sizing: border-box` both cards measure the same outer size — so getBoundingClientRect reports them aligned — but absolutely-positioned children (.sc-card-photo, .sc-card-img, .sc-cbar) are painted from the *padding* box, i.e. 1px inside the border. So on photo cards the image and the team header bar sat 1px lower and smaller than on title cards: photos looked shorter with a gap above them, and the connecting header bars didn't line up into one continuous row. Removing the border makes the padding box equal the border box, so photos fill flush to the card top and the header bars align across each team. Co-Authored-By: Claude Opus 4.8 (1M context) --- static/css/steering-committee.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/static/css/steering-committee.css b/static/css/steering-committee.css index bcc2dc2eb0d..72a6d53363a 100644 --- a/static/css/steering-committee.css +++ b/static/css/steering-committee.css @@ -148,7 +148,11 @@ article.article .article-container .article-title { /* overflow stays visible so the connecting bar can reach into the gap; the photo itself is clipped by .sc-card-photo. */ overflow: visible; - border: 1px solid transparent; + /* No border: title cards have border:0, and with box-sizing:border-box a 1px border + here would push the absolutely-positioned photo and connecting bar 1px inward, so + photo cards would sit lower/smaller than title cards and the top bars wouldn't line + up into one continuous row. */ + border: 0; /* Portrait aspect ratio 2:3 */ aspect-ratio: 2/3; transition: box-shadow 0.3s ease;