中心绝对定位的div水平与绝对的孩子
中心绝对定位的div水平与绝对的孩子
提问于 2015-11-30 15:08:32
在一个项目中，我在一个页面上有四个绝对定位的元素，它们位于一个绝对定位的容器中(后者是为了使它们相对于viewport的底部对齐，而更多的内容将跟随在viewport下面)。这四个元素是相邻的，不重叠。
是否有一种方法(动态地)对其绝对定位的父元素内的四个元素进行中心化？我知道这听起来很奇怪，因为绝对定位意味着完全没有自动定位。动态意味着元素在某个断点上会同时改变大小和位置，但在任何时候都应该水平地在视图中居中。
我可以用一个额外的内部div来想出这样的解决方案，但我并没有真正解决这个难题，因为我不知道内部div获取其四个绝对定位子元素的总宽度的好方法：
<div class="myAbsoluteContainer">
<div class"myInnerDivForCentering">
<div class="myAbsoluteChildElement" id="child1"></div>
<div class="myAbsoluteChildElement" id="child2"></div>
<div class="myAbsoluteChildElement" id="child3"></div>
<div class="myAbsoluteChildElement" id="child4"></div>
</div>
</div>回答 1
Stack Overflow用户
回答已采纳
发布于 2015-11-30 16:43:36
我不知道你为什么要给孩子们绝对的位置。这就是你想要实现的目标吗：http://jsfiddle.net/k65pxydx？
.myAbsoluteContainer {
text-align: center; /* Centers the elements horizontally */
}
.myAbsoluteChildElement {
display: inline-block;
vertical-align: middle; /* Centers the elements vertically */
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34001697
复制相关文章
相似问题
腾讯云开发者
