# Figure

Ready

- HTML
- View
- Context
- Assets
- Info
- Notes

`

    <figure>
        Inhalt der figure kommt hier hin
        <figcaption>Ich bin eine figcaption</figcaption>
    </figure>

`
`

    <figure>
        Inhalt der figure kommt hier hin
        <figcaption>Ich bin eine figcaption</figcaption>
    </figure>

`
`

    /* No context defined. */

`
File:

- Content:
  `

      figure {
        margin: 0;

        img,
        video {
          width: 100%;
        }
      }

      figcaption {
        @extend %heading-font-regular;

        margin-top: $spacer-xs;
        font-size: $font-size-xxs;
        line-height: $paragraph-line-height-sm;
        text-align: center;
      }

      @media screen and (min-width: $grid-breakpoint-md) {
        figcaption {
          font-size: $font-size-base;
          line-height: $paragraph-line-height-sm;
        }
      }

  `
- URL: /components/raw/figure/_figure.scss
- Filesystem Path: components/05-atoms/media/figure/_figure.scss
- Size: 383 Bytes

- Handle: @figure
- Preview:
  - With layout
  - Component only
- Filesystem Path: components/05-atoms/media/figure/figure.html

No notes defined.