垂直居中问题
使用vertical
<div style="width: 100px;height:500px;background-color: #0000FF;display: table-cell;vertical-align:middle"> <div style="width:50px;height: 50px;background-color: #66aa33;" ></div> </div>
使用transform
#mainContent{ width:500px; height:500px; background-color: #494949; color:red; position: relative; } #item{ width:50px; height:50px; background-color: red; position: absolute; top:250px; left:250px; transform: translate(-50%,-50%); }