W3C home > Mailing lists > Public > public-css-archive@w3.org > January 2017

Re: [csswg-drafts] [css-grid] Stretching image grid items in both dimensions

From: Mats Palmgren via GitHub <sysbot+gh@w3.org>
Date: Mon, 09 Jan 2017 21:11:13 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-271408851-1483996272-sysbot+gh@w3.org>
So, to recap, the problem at hand is that stretching images in a 
ratio-preserving way would fill the grid area in only one axis but 
(likely) not the other and that an author might want to align 
(start/center/end) the image in the non-filled axis.

IMHO, this seems like an edge case and a fairly minor problem.

@fantasai's proposal to solve this problem is to not stretch images at
 all by default.  This is a very drastic and invasive change to solve 
such a minor problem.  I think that stretching all grid items to fill 
their grid area by default is a fundamental part of Grid layout and 
any proposed solution must preserve that. To single out images to not 
do that is inconsistent and unexpected.

Also, I think your reasoning is flawed:
> 3. `align-self` and `justify-self` are defined to be alignment 
properties, not sizing properties.

Well, there is a `stretch` keyword that is designed to do sizing and 
we can't remove that because Flexbox has already shipped with it. 
(Note also that image flex items stretch non-ratio-preserving by 
default, which contradicts your points 1/2.)

I agree with:
> 4. In any case, `align-self` and` justify-self` should always be 
able to perform their duty of assigning extra space in order to align 
the item within its container.

Yes, this is the problem at hand.  Let's solve that in a reasonable 
way without destroying Grid layout completely.

Here's my proposal to solve the align-the-non-filled-axis problem:
Alternative A:
Add new syntax to `align/justify-self` so you can write:
`align-self: normal center`
`align-self: normal end`
Alternative B:
Add new values to align/justify-self so you can write:
`align-self: normal-center`
`align-self: normal-end`

The drawback with A is that it is two keywords and thus can't be used 
with the `place-*` shorthands.  B is slightly ugly, but works as a 
shorthand value.

I think this solution is much more in proportion to this relatively 
minor problem.

So, I'd like the CSSWG to reconsider my proposal that image grid items
 should stretch in a ratio-preserving way by default.  Authors will 
expect all grid items to stretch by default, and as you agree, images 
are expected to preserve the ratio by default. The remaining alignment
 problem can be solved by adding some minor CSS Box Alignment feature 
as I suggested above (there are likely other Align solutions too).

GitHub Notification of comment by MatsPalmgren
Please view or discuss this issue at 
using your GitHub account
Received on Monday, 9 January 2017 21:11:20 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:07 UTC