CSS绝对定位使用left:50%实现水平居中偏左问题

最新推荐文章于 2023-03-04 21:55:11 发布

weixin_30399155

最新推荐文章于 2023-03-04 21:55:11 发布

阅读量596

点赞数

原文链接：http://www.cnblogs.com/jack2013/p/4447786.html

版权

现象：当使用绝对定位进行元素定位时，使用left：50%将元素进行水平居中

但会出现偏左的问题

原因：绝对定位的元素left设为50%时，是已左上角为原点的。

解决方案：只要再使用margin-left属性添加负值补偿回来即可。

比如：

div.panel {
　　position: absolute;
　　top: 180px;
　　left: 50%;
　　margin-left: -150px; /*差不多为该div宽度的一半*/
　　background-image: url(../images/login/panel.png);
　　height: 351px;
　　width: 305px;
　　text-align: center;
}

后面再补充图。

转载于:https://www.cnblogs.com/jack2013/p/4447786.html