前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >元素加了position:absolute则该元素的text-align:center居中失效的解决办法

元素加了position:absolute则该元素的text-align:center居中失效的解决办法

作者头像
蓓蕾心晴
发布2018-04-12 14:07:22
1K0
发布2018-04-12 14:07:22
举报
文章被收录于专栏:前端小叙
代码语言:javascript
复制
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    transform:translate(-50%,-50%);

当元素变为position:absolute时,该元素不占据文档流,text-align:center失效,则可以通过上述方法使元素中的内容垂直水平居中。

或者:

如果仅仅时元素中的文字居中的话, 给该元素加width:100%;text-align:center;就可以成功实现了。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017-12-04 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档