CSS之两个div，如何让子元素div在父元素div中垂直水平居中

CSS之两个div，如何让子元素div在父元素div中垂直水平居中

方法1
.father{
	width:1000px;
	height:500px;
	border:1px solid #f40;
	position:relative;
	
}
.son{
	width:200px;
	height:200px;
	border:1px solid #f40;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
}

方法2
.father{
	width:1000px;
	height:500px;
	border:1px solid #f40;
	position:relative;
	
}
.son{
	width:300px;
	height:300px;
	border:1px solid #f40;
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-150px; /*盒子本身的一半*/
	margin-top:-150px;
	
}

方法3
.father{
	width:1000px;
	height:500px;
	border:1px solid #f40;
	display:flex;
	justify-content:center;
	align-items:center;
}
.son{
	weight:200px;
	height:200px;
	border:1px solid #f40;
}

方法4
.father{
	weight:1000px;
	height:500px;
	border:1px solid #f40;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}
.son{
	width:200px;
	height:200px;
	border:1px solid #f40;
	display:inline-block;
}