Re: [csswg-drafts] [css-grid] Implied Minimum Size of Grid Items

> The implied minimum doesn't take effect in the cross axis at all for
 flex items. This is because flex lines are always auto-sized anyway. 
(Except for single-line flex containers... but in that case the items 
would overflow the flex container in more or less the same way.)

Mmmm, but in a previous comment 
https://github.com/w3c/csswg-drafts/issues/283#issuecomment-239997960 
you said:
>my conclusion is that we need to make sure grid items are sized the 
same (in both axes) as flex items are in the cross axis

So using a flexbox as example:
```html
  <div style="display: flex; width: 20px; height: 20px; border: thick 
solid; font: 50px/1 Monospace;">
    <div style="background: magenta;">item</div>
  </div>
```

The output is the following:
![screenshot from 2016-09-16 
10-02-20](https://cloud.githubusercontent.com/assets/11602/18579263/e05c2f04-7bf4-11e6-9531-9fdd00d70157.png)

* In the main axis (width), the "min-width: auto" applies, so the size
 of the item is bigger than the 20px of the flex container.
* In the cross axis (height), the implied minimum size doesn't have 
any effect, so the height of the item is reduced to 20px.

In the previous comment you confimred that the behavior for grids in 
the similar example should be a 20x20 item. That's why I was 
understanding it was behaving the same than in the cross axis of 
flexboxes.

Also note than if in the flexbox we use `align-items: flex-start;`, 
the height of the item will be bigger than the 20px. Again behaving 
exactly the same than the expected behavior we've just discussed for 
grid.

So probably I'm missing something but I'm not understanding the whole 
thing yet, sorry. :pensive: 

-- 
GitHub Notification of comment by mrego
Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/283#issuecomment-247545477 
using your GitHub account

Received on Friday, 16 September 2016 08:24:22 UTC