# Content

**direction:** StackDirection

设置内部元素的排布方向，"vertical'或者"horizontal"。默认是"vertical"。

```jsx
// Vertical
<Stack direction="vertical" />

// Horizontal
<Stack direction="horizontal" />
```

**gap:** number

子元素之间的间隔，默认是10。

```jsx
<Stack gap={120} />
```

**alignment:** StackAlignment

设置内部元素布局的在交叉轴上的对齐方式，"start". "end" 或者"center", 默认是center。这里可以参考flex布局中的align-items属性

```jsx
<Stack alignment="end" />
```

**distribution:** StackDistribution

定义内部元素的分布方式。默认是"space-around"。

&#x20;\- "start" --- 靠容易左边对齐

&#x20;\- "center" --- 布局在容器的中间

&#x20;\- "end" --- 靠容器右边对齐

&#x20;\- "space-around" --- 两端元素到容器边的距离等于中间元素之间的间隔一半

&#x20;\- "space-between" --- 两端对齐，中间的元素间隔平分多余的空间

&#x20;\- "space-evently" --- 所有元素的间距相等

```jsx
// Default
<Stack distribution="space-around" />

// Start
<Stack distribution="start" />

// Center
<Stack distribution="center" />

// End
<Stack distribution="end" />

// Space Between
<Stack distribution="space-between" />

// Space Around
<Stack distribution="space-around" />

// Space Evenly
<Stack distribution="space-evenly" />
```


---

# 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://yinglinhan.gitbook.io/framer-x-api/library-ku/stack/content.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.