Files
yoga/website-next/docs/examples/min-max-width-height.mdx
Joe Vilches 6205338c34 Add min max width height documentation (#1601)
Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1601

tsia

Reviewed By: NickGerleman

Differential Revision: D54780258

fbshipit-source-id: 6690e4d776b948ae0f8ae3e331f395bdada68089
2024-03-12 11:31:46 -07:00

49 lines
1.0 KiB
Plaintext

---
sidebar_position: 12
---
import Playground from '@site/src/components/Playground';
# Min/Max Width and Height
These properties set the maximum and minimum size constraints of an element.
They have higher priority than all other properties and will always be respected.
Constraints can be specified as either absolute pixel values or as percentages of their
parent's size. By default all these constraints are `undefined`.
<Playground code={`<Layout config={{useWebDefaults: false}}>
<Node
style={{
width: 250,
height: 250,
padding: 10
}}>
<Node style={{margin: 5, height: 25}} />
<Node
style={{
margin: 5,
height: 100,
maxHeight: 25
}}/>
<Node
style={{
margin: 5,
height: 25,
minHeight: 50
}}/>
<Node
style={{
margin: 5,
height: 25,
maxWidth: 25
}}/>
<Node
style={{
margin: 5,
height: 25,
width: 25,
minWidth: 50
}}/>
</Node>
</Layout>`} />