怎么让div中的div上下居中

Posted 2023-04-21

参考技术A 方法一：
<div style="width:100px;height:200px;background-color:yellow;line-height:200px;position:relative">
<div style="width:50px;height:50px;background-color:#ff6600;margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0; ">
</div>
</div>
方法二：用table布局(不喜欢用 不写了)
方法三：我最喜欢的方法，直接用给爸爸加padding控制垂直方向的距离
<div style="width:100px;background-color:yellow;padding:50px 0">
<div style="width:50px;height:50px;background-color:#ff6600; ">
</div>
</div>本回答被提问者采纳

怎么让span在div中垂直居中

使用display:table-cell，span中内容无论多少，都可以垂直居中

<div style="display:table-cell;height:100px;font-size:12px;font-height:14px;vertical-align:middle;text-align:center">

<span>

ceshiceshi

</span>

</div>

另外，有设置line-height等于外面div的height方法，但是无法正常显示太长的内容 参考技术A

如果 div 是 float 时，上述解决方法是不能垂直居中的，有什么别的方法吗？不能用line-height.