Re: [csswg-drafts] [css-flexbox] flex-wrap-layout property for wrapped flex lines (#8252)

I don't understand what your source code example is trying to say. It looks like you're trying to draw a metaphor to source-code indentation?

>  It's clearly visible from the HTML that it's one dimensional. All areas are declared in the same level in order.

Here's your HTML again, to be clear:

```html
<div class="container">
  <div class="yAxis">
    <span>100%</span>
    <span>75%</span>
    <span>25%</span>
    <span>0%</span>
  </div>
  <div class="graph">
    <span height40></span>
    <span height20></span>
    <span height100></span>
    <span height10></span>
  </div>
  <div class="spacer"></div>
  <div class="xAxis">
    <span>Item 1</span>
    <span>Item 2</span>
    <span>Item 3</span>
    <span>Item 4</span>
  </div>
</div>
```

The container has three children, each of which have four spans. Without context, I could imagine someone wanting each child to be a row or column, with the spans aligned across them, but that's Grid Layout, and already doable (set the container to `display:grid`, make the children subgrids, then the spans will be grid items and will line up).

But that's not what you're doing. Instead, the second child is a bar graph, while the first and third are axis labels for that graph. These are fundamentally not 1-dimensional layout; the three children interact in a very specific 2-d fashion. If you tried to lay out all three children in one row, it would produce a nonsensical, unreadable result. Instead, you *must* have the first be laid out vertically and positioned horizontally adjacent to the graph, while the third is laid out horizontally and must be positioned vertically adjacent to the graph.

So, I'm still not certain what benefit you think you're getting from trying to use a Flexbox here (besides just "the JS library I'm using understands Flex but not Grid").

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 13 March 2023 21:05:30 UTC