css_垂直居中

html

<div class="parent">
	<div class="child">demo</div>
</div>

垂直居中(父子容器都不定高)

1. table

.parent{
	display: table-cell;
	vertical-align: middle;
}

将外层parent的div变成表格里面的单元格

2. 相对定位

.parent{
	position: relative;
}
.child{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

3. flex + align-items

.parent{
	display:flex;
	align-items: center;
}