MaxWidth
The MaxWidth component is a container that allows you to set a maximum width for its content. Useful for creating centered layouts with width constraints.
import React from "react";
import { MaxWidth, Box } from "cherry-styled-components";
export default function Page() {
return (
<MaxWidth $size={150}>
<Box>150px</Box>
</MaxWidth>
);
}Properties
childrenReact.ReactNode
Content to constrain.
sizenumber
Maximum width in pixels.
$xsnumber
Max width at xs breakpoint.
$smnumber
Max width at sm breakpoint.
$mdnumber
Max width at md breakpoint.
$lgnumber
Max width at lg breakpoint.
$xlnumber
Max width at xl breakpoint.
$xxlnumber
Max width at xxl breakpoint.
$xxxlnumber
Max width at xxxl breakpoint.