> For the complete documentation index, see [llms.txt](https://docs.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.themeware.design/additional-features/cms-extensions/cms-blocks/columns/two-columns-swapped-on-phones.md).

# Two columns (swapped on phones)

{% hint style="info" %}
**Note**: This article is work in progress.
{% endhint %}

Der ThemeWare® CMS-Block "**Zwei Spalten (auf Handys getauscht)**" (50% | 50%) ist ein universeller CMS-Block. In diesen kannst du diverse CMS-Elemente platzieren.

<figure><img src="/files/P7CVSEtQmxmKqqfsBFQA" alt=""><figcaption><p>ThemeWare® CMS block "Two columns (swapped on phones)" [Pro]</p></figcaption></figure>

Der CMS-Block "Zwei Spalten (auf Handys getauscht)" ist eine Variante vom CMS-Block "Zwei Spalten" (siehe [Two columns](/additional-features/cms-extensions/cms-blocks/columns/two-columns-1.md)). Hier unterscheidet sich lediglich die Anordnung der beiden Spalten in mobilen Viewports. In dieser Variante wird die zweite Spalte oberhalb der ersten Spalte angeordnet und nicht darunter.

## Example

<figure><img src="/files/YNTafzNClyG7fwkgYifE" alt=""><figcaption><p>ThemeWare® CMS block "Two columns (swapped on phones)"</p></figcaption></figure>

<figure><img src="/files/Ie2ZL1gtXx2eUuzKfLOL" alt=""><figcaption><p>Links: "Zwei Spalten" | Rechts: "Zwei Spalten (auf Handys getauscht)"</p></figcaption></figure>

{% hint style="success" %}
**Tipp**: Die Spaltenabstände kannst du mit den ThemeWare® CSS-Abstandsklassen (siehe "[Adjusting column spacings in CMS blocks](https://knowledge.themeware.design/knowledge-base/tutorials/shopping-experiences/adjusting-column-spacings-in-cms-blocks)") modifizieren.) modifizieren.
{% endhint %}

***

## Demo

You can find some examples of use in our demo shops:

{% embed url="<https://demo.themeware.design/modern/en/Features/ThemeWare-CMS-blocks/Column-blocks/>" %}
ThemeWare® Demoshop => Column blocks
{% endembed %}