---
title: Düzen
description: Elementin düzen stilleri.
---

Düzen kısmı iki temel `display` özelliği ile çalışır: `flex` ve `grid`. Her iki tipte de aşağıdaki ortak özellikler kullanılabilir:

- **Öğeleri Dağıt** — `justify-content`
- **Öğeleri Hizala** — `align-items`
- **Boşluk** — `gap`
- **İçerik Yönü** — `direction`

## Flex

Flex düzeninde ek olarak şu özellikler güncellenebilir:

- **Yön** — `flex-direction`
- **Alt Satıra Geç** — `flex-wrap`

<img src="/media/ikas-studio/content-and-design/elements/style/layout-flex.png" style={{ maxWidth: "400px", boxShadow: "0 4px 24px rgba(0, 0, 0, 0.08)" }} />

## Grid

Grid düzeninde ek olarak şu özellikler güncellenebilir:

- **Sütun Sayısı** — `grid-template-columns`
- **Satır Sayısı** — `grid-template-rows`

<img src="/media/ikas-studio/content-and-design/elements/style/layout-grid.png" style={{ maxWidth: "400px", boxShadow: "0 4px 24px rgba(0, 0, 0, 0.08)" }} />

<Callout type="warning" title="Alt element stilleri">
Kapsayıcının tipine göre (flex veya grid), altındaki elementlerde [Flex Child](https://builders.ikas.com/tr/docs/ikas-studio/content-and-design/elements/style/flex-child) ve [Grid Child](https://builders.ikas.com/tr/docs/ikas-studio/content-and-design/elements/style/grid-child) özellikleri açılır.
</Callout>