CSS实现垂直水平居中

用到的属性是transform( http://www.w3school.com.cn/cssref/pr_transform.asp),

HTML:

<!-- 垂直水平居中 --><div id="out">    <div id="in"></div></div>

CSS:

/*垂直水平居中*/#out{    position:relative;    width:200px;    height:200px;    border:2px solid yellow;}#in{    position:absolute;    width:100px;    height:100px;    left:50%;    top:50%;    background-color:pink;    -ms-transform:translate(-50%,-50%);      /* IE 9 */    -moz-transform:translate(-50%,-50%);     /* Firefox */    -webkit-transform:translate(-50%,-50%); /* Safari 和 Chrome */    -o-transform:translate(-50%,-50%);       /* Opera */    transform:translate(-50%,-50%);}