Height
Use h
prop to control the height of an element.
Name | Value | Pixels |
|
---|---|---|---|
2xs | |||
xs | |||
sm | |||
md | |||
lg | |||
xl | |||
3xl | |||
0 | |||
10 | |||
12 | |||
16 | |||
20 | |||
24 | |||
32 | |||
40 | |||
48 | |||
56 | |||
64 | |||
80 | |||
224 | |||
384 | |||
1/2 | |||
1/3 | |||
1/4 | |||
2/3 | |||
2/4 | |||
3/4 | |||
auto | |||
fit | |||
full | |||
max | |||
min |
#
Documentation
#
#
Usage
#
h=384
h=224
h=3xl
h=64
h=xl
import { Box } from "@optiaxiom/react";
import { Canvas } from "../Canvas";
export function App() {
return (
<Canvas>
<Box display={["none", "grid"]} h="384">
h=384
</Box>
<Box display={["none", "grid"]} h="224">
h=224
</Box>
<Box h="3xl">h=3xl</Box>
<Box h="64">h=64</Box>
<Box h="xl">h=xl</Box>
</Canvas>
);
}