Row: fix align top (#20963)

pull/21052/head
好多大米 2021-06-07 19:05:03 +08:00 committed by GitHub
parent e1990a70d3
commit 5ba0f1c219
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 10 additions and 9 deletions

View File

@ -337,7 +337,7 @@ The classes are:
| gutter | grid spacing | number | — | 0 |
| type | layout mode, you can use flex, works in modern browsers | string | — | — |
| justify | horizontal alignment of flex layout | string | start/end/center/space-around/space-between | start |
| align | vertical alignment of flex layout | string | top/middle/bottom | top |
| align | vertical alignment of flex layout | string | top/middle/bottom | |
| tag | custom element tag | string | * | div |
### Col Attributes

View File

@ -338,7 +338,7 @@ Las clases son:
| gutter | espaciado de la grilla | number | — | 0 |
| type | modo del layout , puedes usar flex, funciona en navegadores modernos | string | — | — |
| justify | alineación horizontal del layout flex | string | start/end/center/space-around/space-between | start |
| align | alineación vertical del layout flex | string | top/middle/bottom | top |
| align | alineación vertical del layout flex | string | top/middle/bottom | |
| tag | tag de elemento propio | string | * | div |
### Atributos Col

View File

@ -338,7 +338,7 @@ Ces classes sont:
| gutter | Espacement de la grille. | number | — | 0 |
| type | Mode de mise en page. Vous pouvez utiliser flex, qui fonctionne sur les navigateurs modernes. | string | — | — |
| justify | Alignement horizontal pour le mise en page flex. | string | start/end/center/space-around/space-between | start |
| align | Alignement vertical pour la mise en page flex. | string | top/middle/bottom | top |
| align | Alignement vertical pour la mise en page flex. | string | top/middle/bottom | |
| tag | Élément de tag personnalisé. | string | * | div |
### Attributs des colonnes

View File

@ -336,7 +336,7 @@ import 'element-ui/lib/theme-chalk/display.css';
| gutter | 栅格间隔 | number | — | 0 |
| type | 布局模式,可选 flex现代浏览器下有效 | string | — | — |
| justify | flex 布局下的水平排列方式 | string | start/end/center/space-around/space-between | start |
| align | flex 布局下的垂直排列方式 | string | top/middle/bottom | top |
| align | flex 布局下的垂直排列方式 | string | top/middle/bottom | |
| tag | 自定义元素标签 | string | * | div |
### Col Attributes

View File

@ -14,10 +14,7 @@ export default {
type: String,
default: 'start'
},
align: {
type: String,
default: 'top'
}
align: String
},
computed: {
@ -38,7 +35,7 @@ export default {
class: [
'el-row',
this.justify !== 'start' ? `is-justify-${this.justify}` : '',
this.align !== 'top' ? `is-align-${this.align}` : '',
this.align ? `is-align-${this.align}` : '',
{ 'el-row--flex': this.type === 'flex' }
],
style: this.style

View File

@ -27,6 +27,10 @@
justify-content: space-around;
}
@include when(align-top) {
align-items: flex-start;
}
@include when(align-middle) {
align-items: center;
}