- From: Ana Tudor via GitHub <sysbot+gh@w3.org>
- Date: Tue, 05 Apr 2022 15:14:47 +0000
- To: public-css-archive@w3.org
# Problem 4: `thumb` and `track` vertical alignment This issue is one that it's been easy to get around, but it's a very common and annoying one, arising in WebKit browsers every single time we set the `height` of `border-box` of the `thumb` to be different from that of the `content-box` of the `track`. This happens because in WebKit browsers, after setting `-webkit-appearance: none` the default `height` of the `content-box` of the `track` is given by that of the `border-box` of the `thumb`. So when both the `track` and the `thumb` have a `height` that's explicitly set and these heights don't match, they are top-aligned, not middle aligned, which is what almost every design I've implemented asked for. Fortunately, it been easy to fix so far with a `margin-top` only set on `::-webkit-slider-thumb` (but not on `::-moz-range-thumb` as well, since the `track` and `thumb` are middle aligned by default in Firefox). -- GitHub Notification of comment by thebabydino Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4410#issuecomment-1088848658 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 5 April 2022 15:14:48 UTC