- From: Sebastian Zartner via GitHub <sysbot+gh@w3.org>
- Date: Fri, 05 May 2023 20:31:34 +0000
- To: public-css-archive@w3.org
> I'll note that variable-sized gaps directly impacts our ability to do gap images (#2748) in anything remotely similar to a `border-image` style. I think it's an either/or proposition. I claim that variable-sized gaps and gap images can work quite well together. And we already need to solve this, anyway, because horizontal and vertical sizes can already differ. ----- > To expand on this, border-image requires specifying 4 stretchable/tileable images, one for each side because the sides can be different sizes. These four sides intersect at four corners, so you need 4 corner images as well. (Conveniently, we can combine these 8 images into a single image that we slice up.) > > Gap images will require 6 images for the "straight" sections - two endcaps and one stretchable/tileable part each, for the two axises. Then you need images for the intersections as well @MatsPalmgren's [proposed spec.](https://matspalmgren.github.io/css-gap-decorations/Overview.html), we sticks with 6 images. Though it reuses the end caps for the intersections. > I _think_ you end up needing 17 to fully cover the intersection possibilities. I wonder how you get those 17. 6 images plus 2 intersection images are 8. Or if you want to, you could require another stretchable/tileable image between the intersection and the end cap, then you'd have 10 in total. ----- Anyway, the different proposals related to gap images already define a thickness for them. So the width of the gap and the width of the image can be set individually and they work independently from each other. Mats' spec. has an [animated example illustrating that](https://matspalmgren.github.io/css-gap-decorations/Overview.html#example-0518370f). Also, here's an example how variable-sized gaps and gap images could look (please don't judge my painting skills, it's just for illustration): ![Grid with variable-sized gaps and gap images](https://user-images.githubusercontent.com/958943/236562429-284d5b22-f321-43f0-8c37-746253bea932.png) If we _want_ the gap sizes and image sizes to work together, we could define a way to let the rule width be influenced by the gap width. In that case, the different images would need to be stretched or squeezed in the cross-axis to the rule depending on the gap's width. Having said that, I'm not sure whether there are any use cases for such a behavior. Sebastian -- GitHub Notification of comment by SebastianZ Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1659#issuecomment-1536749798 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Friday, 5 May 2023 20:31:37 UTC