> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.weblium.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Налаштування сітки для Flex Block

Сітка (Grid) допомагає точніше вирівнювати елементи, будувати структуру блоку та працювати з адаптивністю. У цій інструкції ви дізнаєтеся, як увімкнути сітку, налаштувати кількість колонок, змінити її вигляд та використовувати прилипання до колонок.

Зміст:
* [Увімкнення сітки](#1-uvimknennya-sitki)
* [Зміна кількості кнопок](#1-zmina-kilkosti-kolonok)
* [Зміна кольору сітки](#1-zmina-koloru-sitki)
* [Увімкнення прилипання до сітки](#1-uvimknennya-prilipannya-do-sitki)


# Увімкнення сітки 

У верхній панелі інструментів натисніть іконку **Інструменти**. Після чого у меню, що відкриється, увімкніть опцію **Показувати сітку**:
 
![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/sitka-ukr-1_ssluwa.png)

# Зміна кількості колонок

Відкрийте **Інструменти**, після чого перейдіть до іконки **Налаштування сітки**:

![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/sitka-ukr-2_xtubo6.png)

У вікні налаштувань оберіть кількість колонок для кожного типу пристрою:

![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/sitka-ukr-3_1v8uwfu.png)

* **Десктоп**: 12 (за замовчуванням), 8, 6
* **Планшет**: 8 (за замовчуванням), 12, 6
* **Мобільні пристрої**: 4 (за замовчуванням), 6, 2

Також можна встановити кастомне значення для кількості колонок, але не більше 36/24/12 для десктопу/планшету/мобільних пристроїв відповідно.

| Примітка: зміна кількості колонок автоматично перераховує їхню ширину. 


# Зміна кольору сітки

Відкрийте **Інструменти**, після чого перейдіть до іконки **Налаштування сітки**.  У полі **Колір** виберіть колір відображення сітки:

![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/sitka-ukr-4_k2pijq.png)

| Примітка: це допоможе краще бачити сітку на темному або світлому фоні.


# Увімкнення прилипання до сітки

Якщо увімкнути цю функцію, [абсолютні](/uk/article/absolyutne-pozicionuvannya-elementiv-u-zvichajnih-blokah-2kzydj/) елементи будуть автоматично **прилипати до колонок**, коли ви їх переміщуєте або змінюєте їхній розмір.

Це дозволяє:
* легко вирівнювати елементи за сіткою;
* дотримуватись чіткої структури;
* уникати випадкових зміщень.

Для цього відкрийте **Інструменти** та увімкніть у меню, що зʼявилось, функцію *Притягування до обʼєктів*:

![](https://storage.crisp.chat/users/helpdesk/website/-/f/a/8/4/fa84b4d83a50e800/sitka-ukr-5_2lu1bj.png)


| Примітка: сітка не впливає на фінальний вигляд сайту — це лише допоміжний інструмент для дизайну.