# Container.

## Übersicht

### Was macht die Komponente?

- Beinhaltet andere Komponenten.

### Wann soll die Komponente eingesetzt werden?

- Wenn Inhalte strukturiert werden sollen.

### Regeln

- Die Content-Box kann an einer beliebigen Stelle verwendet werden.
- Die Footer-Box liegt fixiert positioniert vor den anderen Inhalten.
- Die Footer-Box schliesst oberhalb an die [Tabbar](https://digital.sbb.ch/de/design-system/mobile/components/tabbar/) an.

## Varianten

### Varianten

Die Komponente hat folgende Varianten:

- Content-Box
- Footer-Box

#### Content-Box

![Container, Content-Box](https://digital.sbb.ch/assets/images/mobile/container-content-box-light.webp "Container, Content-Box")

![Container, Content-Box](https://digital.sbb.ch/assets/images/mobile/container-content-box-dark.webp "Container, Content-Box")

#### Footer-Box

![Container, Footer-Box](https://digital.sbb.ch/assets/images/mobile/container-footer-box-light.webp "Container, Footer-Box")

![Container, Footer-Box](https://digital.sbb.ch/assets/images/mobile/container-footer-box-dark.webp "Container, Footer-Box")

### Spezifikationen

[Design](https://www.figma.com/design/ZBotr4yqcEKqqVEJTQfSUa/Design-System-Mobile?node-id=141-2024&t=OQ7s4wE6eWI2fLGh-1)

---

Source: https://digital.sbb.ch/de/design-system/mobile/components/container/