DaddyFrosty/yoga
1
0
Fork 0
Code Issues 96 Pull Requests 31 Actions Packages Projects Releases 33 Wiki Activity

Add containing block documentation (#1615)

Browse Source 
Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1615

tsia

Reviewed By: yungsters

Differential Revision: D54822992

fbshipit-source-id: b98cd32bb2a753ff7088533fda4b4e9d4ad5a6e4
This commit is contained in:
Joe Vilches
2024-03-13 10:19:30 -07:00
committed by Facebook GitHub Bot
parent 1db7a3ff61
commit 609a9a7a30
7 changed files with 97 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
website-next/docs/styling/position.mdx
View File

@@ -9,14 +9,14 @@ import Playground from '@site/src/components/Playground';
**Relative (default)**: This node is laid out according to the specified flow of the flex container it is apart of.
That is, it particpates in the flexbox algorithm and will take up space within the container, unlike absolute.
Insets (`left`, `right`, `top`, `bottom`, etc) will offset the node from its normal position within its container.
This node will always form a [containing block](https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block).
This node will always form a [containing block](/docs/advanced/containing-block).
**Absolute**: This node is removed from the specified flow of the flex container it is apart of.
Absolute nodes do not take up space in its flex container and will not affect the position of
its siblings. Insets will offset the node from its [containing block](https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block).
its siblings. Insets will offset the node from its [containing block](/docs/advanced/containing-block).
**Static**: This node behaves like relative except it will ignore insets and will not
form a [containing block](https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block).
form a [containing block](/docs/advanced/containing-block).
<Playground code={`<Layout config={{useWebDefaults: false}}>
<Node