> For the complete documentation index, see [llms.txt](https://wiki.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.themeware.design/wissensdatenbank/anleitungen/erlebniswelten/css-klassen-fuer-sektionen-ueber-die-volle-breite.md).

# CSS-Klassen für Sektionen über die volle Breite

## Boxed-Klassen – CSS-Klassen für Full-width-Sektionen

Da die CSS-Klasse `container` nicht in jedem Szenario die perfekte Lösung ist, gibt es seit ThemeWare® 1.1.3 neue CSS-Boxed-Klassen um CMS-Blöcke oder CMS-Sektionen in Erlebniswelten "boxed" zu gestalten.

<figure><img src="/files/79jMs5KnHki45wQBh1It" alt=""><figcaption><p>Links: "Full width"-Sektion | Rechts: "Full width"-Sektion mit zentriertem CMS-Block (boxed)</p></figcaption></figure>

***

## ThemeWare® CSS-Boxed-Klassen

| CSS-Klasse                | Bereich | Funktionsbeschreibung                                                                         |
| ------------------------- | ------- | --------------------------------------------------------------------------------------------- |
| **twt-cms-boxed-content** | Sektion | Setzt eine Sektion auf die maximale Container-Breite der Theme-Konfiguration.                 |
| **twt-cms-block-boxed**   | Block   | Setzt einen Block auf die maximale Container-Breite der Theme-Konfiguration (abzüglich 40px). |

#### Beispiele

<figure><img src="/files/0XlU1W4Na4NCvQAUrNTX" alt=""><figcaption><p>"Full with"-Sektion mit zentrierten CMS-Blöcken</p></figcaption></figure>

<figure><img src="/files/Ws6OcvEElByE7DzFHVw5" alt=""><figcaption><p>"Full with"-Sektion mit einem spezifischen, zentrierten CMS-Block</p></figcaption></figure>

***

## max-width-Klassen – Breite von CMS-Sektionen/-Blöcken

ThemeWare® bietet dir verschiedene CSS-"max-width"-Klassen um die maximale Breite von CMS-Sektionen/-Blöcken zu definieren.

> Diese CSS-Klassen stehen dir zur Verfügung, wenn du die folgende Theme-Konfiguration aktivierst:
>
> * Tab "Weiteres" => Bereich "Erweiterte Einstellungen" => Abschnitt "Zusätzliche CSS-Klassen" => CSS "max-width"-Klassen (optional)

***

## ThemeWare® CSS-"max-width"-Klassen

| CSS-Klasse                 | Bereich        | Funktionsbeschreibung                                                                  |
| -------------------------- | -------------- | -------------------------------------------------------------------------------------- |
| **twt-cms-max-width**      | Sektion, Block | Setzt die maximale Breite auf die "maximale Container-Breite" der Theme-Konfiguration. |
| **twt-cms-max-width-500**  | Sektion, Block | Setzt die maximale Breite auf 500px.                                                   |
| **twt-cms-max-width-576**  | Sektion, Block | Setzt die maximale Breite auf 576px.                                                   |
| **twt-cms-max-width-600**  | Sektion, Block | Setzt die maximale Breite auf 600px.                                                   |
| **twt-cms-max-width-700**  | Sektion, Block | Setzt die maximale Breite auf 700px.                                                   |
| **twt-cms-max-width-768**  | Sektion, Block | Setzt die maximale Breite auf 768px.                                                   |
| **twt-cms-max-width-800**  | Sektion, Block | Setzt die maximale Breite auf 800px.                                                   |
| **twt-cms-max-width-900**  | Sektion, Block | Setzt die maximale Breite auf 900px.                                                   |
| **twt-cms-max-width-992**  | Sektion, Block | Setzt die maximale Breite auf 992px.                                                   |
| **twt-cms-max-width-1000** | Sektion, Block | Setzt die maximale Breite auf 1000px.                                                  |
| **twt-cms-max-width-1100** | Sektion, Block | Setzt die maximale Breite auf 1100px.                                                  |
| **twt-cms-max-width-1200** | Sektion, Block | Setzt die maximale Breite auf 1200px.                                                  |
| **twt-cms-max-width-1300** | Sektion, Block | Setzt die maximale Breite auf 1300px.                                                  |
| **twt-cms-max-width-1400** | Sektion, Block | Setzt die maximale Breite auf 1400px.                                                  |
| **twt-cms-max-width-1500** | Sektion, Block | Setzt die maximale Breite auf 1500px.                                                  |
| **twt-cms-max-width-1600** | Sektion, Block | Setzt die maximale Breite auf 1600px.                                                  |
| **twt-cms-max-width-1700** | Sektion, Block | Setzt die maximale Breite auf 1700px.                                                  |
| **twt-cms-max-width-1800** | Sektion, Block | Setzt die maximale Breite auf 1800px.                                                  |
| **twt-cms-max-width-1920** | Sektion, Block | Setzt die maximale Breite auf 1920px.                                                  |