javascript - position 绝对定位的居中问题。
巴扎黑
巴扎黑 2017-04-11 13:07:14
[JavaScript讨论组]

我在表格td里面放了一个p。给TD设置的relative;然后这个p absolute; 我设置了。left0 right:0 maigin o auto 但是还是没有居中。。--是什么原因呢。我觉得可能是因为这个p比td的宽度还要宽。所以失效了。。
怎么解决么。

长宽高这个框应该在委3/400 这个td里面。。。

巴扎黑
巴扎黑

全部回复(6)
高洛峰

方法一:
p{

position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin:auto;

}
方法2:
p{

position: absolute;
left: 50%;
top: 50%;
transform:translate(-50%,-50%);

}

高洛峰

用了position absolute,margin 0 auto 就没用啦

天蓬老师

absolute不适用于margin:0 auto
你要写left: 50%, margin-left :-xxxpx
xxx为你这个p一半的宽度

巴扎黑

为什么不用text-align:center

大家讲道理

你现在的代码是不是先写{委/3/4002.123...}然后再写的{长宽高},是的话试试把{长宽高}代码的位置提前到{委/3/4002.123...}的前面,不清楚你代码具体的写法,这个小办法估计可能会成

PHPz

有个absolute居中的技巧你可以试下:
p{
position: absolute;
top:0;
left: 0;
right: 0;
bottom: 0;
margin:auto;
}
原因:For absolutely positioned elements, the top, right, bottom,and left properties specify offsets from the edge of the element's containing block (what the element is positioned relative to).The margin of the element is then positioned inside these offsets.

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号