# Adjusting gaps in CMS blocks

## ThemeWare® "Grid" CMS blocks

Elements in "Grid" CMS blocks have a fixed spacing of `40px` in Shopware 6. ThemeWare® provides you with various CSS classes to change this spacing.

With ThemeWare® 3.2 we have added the following CSS gap classes for ThemeWare® "Grid" CMS blocks as well as the standard "Grid" CMS blocks from Shopware.

#### **CSS classes**

| Class                   | Block/Section | Description                              |
| ----------------------- | ------------- | ---------------------------------------- |
| **twt-cms-grid-gap-0**  | Block         | Sets the gap in CMS blocks to 0 pixels.  |
| **twt-cms-grid-gap-5**  | Block         | Sets the gap in CMS blocks to 5 pixels.  |
| **twt-cms-grid-gap-10** | Block         | Sets the gap in CMS blocks to 10 pixels. |
| **twt-cms-grid-gap-15** | Block         | Sets the gap in CMS blocks to 15 pixels. |
| **twt-cms-grid-gap-20** | Block         | Sets the gap in CMS blocks to 20 pixels. |
| **twt-cms-grid-gap-25** | Block         | Sets the gap in CMS blocks to 25 pixels. |
| **twt-cms-grid-gap-30** | Block         | Sets the gap in CMS blocks to 30 pixels. |
| **twt-cms-grid-gap-35** | Block         | Sets the gap in CMS blocks to 35 pixels. |
| **twt-cms-grid-gap-40** | Block         | Sets the gap in CMS blocks to 40 pixels. |
| **twt-cms-grid-gap-45** | Block         | Sets the gap in CMS blocks to 45 pixels. |
| **twt-cms-grid-gap-50** | Block         | Sets the gap in CMS blocks to 50 pixels. |

{% hint style="info" %}
**Note**: How to insert the CSS classes please find in the article [ThemeWare® CSS classes for Shopping Experiences](/knowledge-base/tutorials/shopping-experiences/themeware-css-classes-for-shopping-experiences.md).
{% endhint %}

#### Details

<figure><img src="/files/5s1PB5EXhNg1MsU07yAT" alt=""><figcaption></figcaption></figure>

***

## ThemeWare® "Columns" CMS blocks

The new CSS "Gap" classes also work in the "Columns" blocks of ThemeWare®.

#### Details

<figure><img src="/files/FGUZgfCK4oV1Uj3zVsnn" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
**Note**: If you want to adjust the spacing in mobile viewports separately, use the separate CSS column spacing classes: [Adjusting column spacings in CMS blocks](/knowledge-base/tutorials/shopping-experiences/adjusting-column-spacings-in-cms-blocks.md)
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://knowledge.themeware.design/knowledge-base/tutorials/shopping-experiences/adjusting-gaps-in-cms-blocks.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.