Skip to content

Commit

Permalink
[Grid] Clarify document about direction column limitation (#22871)
Browse files Browse the repository at this point in the history
  • Loading branch information
ThewBear authored Oct 5, 2020
1 parent 0b1745b commit 1bcf360
Showing 1 changed file with 4 additions and 6 deletions.
10 changes: 4 additions & 6 deletions docs/src/pages/components/grid/grid.md
Original file line number Diff line number Diff line change
Expand Up @@ -135,12 +135,10 @@ In practice, you can set the `zeroMinWidth` prop:

### direction: column | column-reverse

Though the `Grid` component has a `direction` prop that allows values of `row`, `row-reverse`, `column`, and `column-reverse`,
there are some features that are not supported within `column` and `column-reverse` containers.
The props which define the number of grids the component will use for a given breakpoint
(`xs`, `sm`, `md`, `lg`, and `xl`) are focused on controlling width
and do **not** have similar effects on height within `column` and `column-reverse` containers.
If used within `column` or `column-reverse` containers, these props may have undesirable effects on the width of the `Grid` elements.
The `xs`, `sm`, `md`, `lg`, and `xl` props are **not supported** within `direction="column"` and `direction="column-reverse"` containers.

They define the number of grids the component will use for a given breakpoint. They are intended to control **width** using `flex-basis` in `row` containers but they will impact height in `column` containers.
If used, these props may have undesirable effects on the height of the `Grid` item elements.

## CSS Grid Layout

Expand Down

0 comments on commit 1bcf360

Please sign in to comment.