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

Re: [csswg-drafts] [css-grid] Position cells individually

From: Tab Atkins Jr. via GitHub <sysbot+gh@w3.org>
Date: Mon, 10 Apr 2017 21:38:48 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-293086906-1491860327-sysbot+gh@w3.org>
>From what I can tell, you want to be able to flow multiple elements into the same cell; right now, they're going in separate cells, and each "row" of the narrow-screen layout is actually several grid rows.  Your "gap" is the result of the "Desc" and "Label 3" data both going in the same grid row, and since the "Desc" sometimes has much more content, it stretches the grid row, making the "Label 3" cell tall as well.

This isn't possible in current Grid. Sometimes, a combination of wrapper `div`s and `display: contents` will work (put things into a wrapper div that want to be "together" in the narrow view, use `display: contents` on the wrapper so you can individually position the things in your wider view), but that's clumsy and won't always work.

Ultimately you want CSS Regions, or a Regions-lite functionality.  This was discussed for Grid, and earlier versions of the spec had it, but it was eventually removed for complexity reasons.  Hopefully it'll show up in Grid 2.

GitHub Notification of comment by tabatkins
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1183#issuecomment-293086906 using your GitHub account
Received on Monday, 10 April 2017 21:38:54 UTC

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