Skip to content

Commit

Permalink
Document that the CSS direction property affects the layout of grid c…
Browse files Browse the repository at this point in the history
…ells
  • Loading branch information
jswalden committed Feb 11, 2025
1 parent 332c437 commit ceba9bf
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions files/en-us/web/css/direction/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,17 @@ browser-compat: css.properties.direction
> [!WARNING]
> Where possible, authors are encouraged to avoid using the `direction` CSS property and use the HTML [`dir`](/en-US/docs/Web/HTML/Global_attributes/dir) global attribute instead.
The **`direction`** [CSS](/en-US/docs/Web/CSS) property sets the direction of text, table columns, and horizontal overflow. Use `rtl` for languages written from right to left (like Hebrew or Arabic), and `ltr` for those written from left to right (like English and most other languages).
The **`direction`** [CSS](/en-US/docs/Web/CSS) property sets the direction of text, table and grid columns, and horizontal overflow. Use `rtl` for languages written from right to left (like Hebrew or Arabic), and `ltr` for those written from left to right (like English and most other languages).

{{EmbedInteractiveExample("pages/css/direction.html")}}

Note that text direction is usually defined within a document (e.g., with [HTML's `dir` attribute](/en-US/docs/Web/HTML/Global_attributes/dir)) rather than through direct use of the `direction` property.

The property sets the base text direction of block-level elements and the direction of embeddings created by the {{Cssxref("unicode-bidi")}} property. It also sets the default alignment of text, block-level elements, and the direction that cells flow within a table row.
The property sets the base text direction of block-level elements and the direction of embeddings created by the {{Cssxref("unicode-bidi")}} property. It also sets the default alignment of text, block-level elements, and the direction that cells flow within a table or grid row.

Unlike the `dir` attribute in HTML, the `direction` property is not inherited from table columns into table cells, since CSS inheritance follows the document tree, and table cells are inside of rows but not inside of columns.

The `direction` and {{cssxref("unicode-bidi")}} properties are the two only properties which are not affected by the {{cssxref("all")}} shorthand property.
The `direction` and {{cssxref("unicode-bidi")}} properties are the only two properties which are not affected by the {{cssxref("all")}} shorthand property.

## Syntax

Expand Down

0 comments on commit ceba9bf

Please sign in to comment.