将绝对元素放置在其相对父元素的中心 [英] positioning an absolute element in the center of it's relative parent element
本文介绍了将绝对元素放置在其相对父元素的中心的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
这是我的代码 我希望子元素位于父元素的底部和中心
here is my code i want child element to be at bottom and center of it's parent
它在底部，但是我无法使其居中
it's in the bottom alright but i cant get it to center
我尝试过
text-align:center ;
对于父母
和
margin:0 auto ;
适用于儿童，但无效
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><body>
<div style='background-color: yellow; width: 70%;
height: 100px; position: relative; text-align:center'>
Outer
<div style='background-color: green;
position: absolute; width: 80%; bottom: 0 ; margin-right:auto ; margin-left:auto ; padding:5px'>
Inner
</div>
</div>
</body>
</html>
推荐答案
这可能会回答您的问题:将基于百分比的div居中
This might answer your question: Centering a percent-based div
使用百分比作为利润.
<div style='background-color: green;
position: absolute; width: 80%; bottom: 0 ; margin-right:10%; margin-left: 10%; padding:5px'>
演示: http://jsfiddle.net/DkNdx/
这篇关于将绝对元素放置在其相对父元素的中心的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
