diff --git a/src/space/demos/enUS/center.demo.md b/src/space/demos/enUS/center.demo.md
new file mode 100644
index 000000000..450500048
--- /dev/null
+++ b/src/space/demos/enUS/center.demo.md
@@ -0,0 +1,9 @@
+# From Center
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/demos/enUS/index.demo-entry.md b/src/space/demos/enUS/index.demo-entry.md
index e13385d5e..b58292c10 100644
--- a/src/space/demos/enUS/index.demo-entry.md
+++ b/src/space/demos/enUS/index.demo-entry.md
@@ -8,6 +8,9 @@ A great invention.
basic
vertical
from-end
+space-between
+space-around
+center
```
## Props
@@ -17,7 +20,7 @@ from-end
| align | `'start' \| 'end' \| 'center' \| 'baseline' \| 'stretch'` | `undefined` | |
| inline | `boolean` | `false` | |
| item-style | `string \| object` | `undefined` | |
-| justify | `'start' \| 'end'` | `'start'` | |
+| justify | `'start' \| 'end' \| 'center' \| 'space-around' \| 'space-between'` | `'start'` | |
| size | `'small' \| 'medium' \| 'large' \| number \| [number, number]` | `'medium'` | |
| vertical | `boolean` | `false` | |
| wrap | `boolean` | `true` | |
diff --git a/src/space/demos/enUS/space-around.demo.md b/src/space/demos/enUS/space-around.demo.md
new file mode 100644
index 000000000..beeabdf7c
--- /dev/null
+++ b/src/space/demos/enUS/space-around.demo.md
@@ -0,0 +1,9 @@
+# Space Around
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/demos/enUS/space-between.demo.md b/src/space/demos/enUS/space-between.demo.md
new file mode 100644
index 000000000..7249de44b
--- /dev/null
+++ b/src/space/demos/enUS/space-between.demo.md
@@ -0,0 +1,11 @@
+# Space Between
+
+In a way, `size` doesn't work on the main axis.
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/demos/zhCN/center.demo.md b/src/space/demos/zhCN/center.demo.md
new file mode 100644
index 000000000..7f9155530
--- /dev/null
+++ b/src/space/demos/zhCN/center.demo.md
@@ -0,0 +1,9 @@
+# 从中间
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/demos/zhCN/index.demo-entry.md b/src/space/demos/zhCN/index.demo-entry.md
index 35bde2a85..45f669928 100644
--- a/src/space/demos/zhCN/index.demo-entry.md
+++ b/src/space/demos/zhCN/index.demo-entry.md
@@ -8,6 +8,9 @@
basic
vertical
from-end
+space-between
+space-around
+center
grid-debug
```
@@ -18,7 +21,7 @@ grid-debug
| align | `'start' \| 'end' \| 'center' \| 'baseline' \| 'stretch'` | `undefined` | |
| inline | `boolean` | `false` | |
| item-style | `string \| object` | `undefined` | |
-| justify | `'start' \| 'end'` | `'start'` | |
+| justify | `'start' \| 'end' \| 'center' \| 'space-around' \| 'space-between'` | `'start'` | |
| size | `'small' \| 'medium' \| 'large' \| number \| [number, number]` | `'medium'` | |
| vertical | `boolean` | `false` | |
| wrap | `boolean` | `true` | |
diff --git a/src/space/demos/zhCN/space-around.demo.md b/src/space/demos/zhCN/space-around.demo.md
new file mode 100644
index 000000000..961596139
--- /dev/null
+++ b/src/space/demos/zhCN/space-around.demo.md
@@ -0,0 +1,9 @@
+# 空间围绕
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/demos/zhCN/space-between.demo.md b/src/space/demos/zhCN/space-between.demo.md
new file mode 100644
index 000000000..bad6add8a
--- /dev/null
+++ b/src/space/demos/zhCN/space-between.demo.md
@@ -0,0 +1,11 @@
+# 间隙
+
+从某种以上来说, `size` 在主轴并没有用。
+
+```html
+
+ Oops!
+ Oops!
+ Oops!
+
+```
diff --git a/src/space/src/Space.tsx b/src/space/src/Space.tsx
index 2b4be84ea..acae23e1d 100644
--- a/src/space/src/Space.tsx
+++ b/src/space/src/Space.tsx
@@ -16,11 +16,12 @@ type Align =
| 'flex-end'
| 'flex-start'
+type Justify = 'start' | 'end' | 'center' | 'space-around' | 'space-between'
const spaceProps = {
...(useTheme.props as ThemeProps),
align: String as PropType,
justify: {
- type: String as PropType<'start' | 'end'>,
+ type: String as PropType,
default: 'start'
},
inline: Boolean,
@@ -93,9 +94,11 @@ export default defineComponent({
} = this
const children = flatten(getSlot(this))
const horizontalMargin = `${margin.horizontal}px`
+ const semiHorizontalMargin = `${margin.horizontal / 2}px`
const verticalMargin = `${margin.vertical}px`
const semiVerticalMargin = `${margin.vertical / 2}px`
const lastIndex = children.length - 1
+ const isJustifySpace = justify.startsWith('space-')
return (