垂直居中
发布: 2016-07-22 13:10:14标签: css
父元素不能浮动;父元素不能display:flex;不能百分比
//可以parent^:display:table - parent:display:table; - chilren:
*/
#parent{
display:table-cell;
text-align:center;
vertical-align:middle;
}
#chilren{
display:inline-block;
}
/*已知元素的高宽*/
#children{
background-color:#6699FF;
width:200px;
height:200px;
position: absolute; /*父元素需要相对定位*/
top: 50%;
left: 50%;
margin-top:-100px ; /*二分之一的height,width*/
margin-left: -100px;
}
/*未知元素的高宽*/
#children{
margin:auto;
position: absolute; /*父元素需要相对定位*/
left: 0;
top: 0;
right: 0;
bottom: 0;
}