The

<Caption>

component is typically used below images or videos. They will default to 4 columns wide unless placed inside a

<Row>

component. In this case, it will assume the full width of its containing column.

Example

Normal

This is a regular caption. It will attempt to respond to it’s container element appropriately.

Full-width Colors

This is a full width caption. With this prop, the caption’s width will be 100% so it will fill its container.

Code

Normal

<Caption>
  This is a regular caption. It will attempt to respond to it’s container
  element appropriately.
</Caption>
Copy to clipboard

Full-width

<Caption fullWidth>

This is a full width caption. With this prop, the caption’s width will be 100%
so it will fill its container.

</Caption>
Copy to clipboard

Props

| property | propType | required | default | description | | --------- | -------- | -------- | ------- | --------------------- | | children | node | | | | | fullWidth | bool | | | Set to full width | | className | string | | | Add custom class name |

Edit this page on GitHub

Components: Aside

Components: Code blocks