Container

Use Container

Container is a named export of @flood-md/react. Connect the package once, then import what you use.

"use client";

import { FloodRoot, Container, Text } from "@flood-md/react";
import "@flood-md/react/styles.css";

export function Example() {
  return (
    <FloodRoot>
      <Container size="md" gutter="6"><Text as="p">Content stays within a readable width.</Text></Container>
    </FloodRoot>
  );
}

Design notes

• Max width includes gutters (border-box). Sizes sm/md/lg use relative semantic roles; full removes the maximum.
• Native div props/ref target the container. Gutter uses Space; it does not add vertical spacing or breakpoints.
• Available in 0.2.4; use matching installed declarations.

API reference