Skip to content

Commit 560ad6e

Browse files
authored
features: Use CSS to properly normalize image sizes (#486)
On the features page, the logos have all different sizes. The height is manually set to 32px, but some other CSS overrides that with `height: auto`: <img width="457" height="237" alt="CleanShot 2025-10-30 at 08 21 59@2x" src="https://github.com/user-attachments/assets/85333943-fb80-457e-bf78-efea97b7b234" /> This PR adds CSS to constrain the height of the logos via `max-height`.
1 parent 2d22a13 commit 560ad6e

2 files changed

Lines changed: 6 additions & 2 deletions

File tree

css/custom.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2585,6 +2585,10 @@ pre code::after {
25852585
background: rgba(0, 0, 0, 0.04);
25862586
}
25872587

2588+
#feature-support th img {
2589+
max-height: 32px;
2590+
}
2591+
25882592
.feature-cell {
25892593
position: relative;
25902594
height: 24px; /* height of the icon inside */

features.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,8 +57,8 @@
5757
...Object.entries(browsers).map(([name, { url, logo }]) =>
5858
h('th', { scope: 'col', id: idMap['table-col'](name) }, [
5959
h('a', { href: url, target: '_blank' }, [
60-
// https://www.w3.org/WAI/WCAG22/Techniques/html/H2
61-
h('img', { src: logo, height: 32, alt: '' }),
60+
// Empty alt trick: https://www.w3.org/WAI/WCAG22/Techniques/html/H2
61+
h('img', { src: logo, alt: '' }),
6262
h('br'),
6363
name,
6464
]),

0 commit comments

Comments
 (0)