javascript - 在相对 div 内部/外部居中绝对 div

Question

是否可以使用 CSS 或 jQuery 将绝对 div 在相对 div 的内部或外部居中，如果您不知道相对 div 的宽度，在这种情况下女巫是两者的父元素。

通常我会做这样的事情:

.child {
position: absolute;
top: 100%;
left: -50px;
width: 200px;
height: 300px;
}

但前提是我知道父级是 100px 宽，但如果我不知道怎么办？

FIDDLE

Answer 1

如果不需要针对 IE8 及更低版本，可以使用 CSS3 calc() 函数:

左:计算(50% - 100px)；

将 100px 替换为您的绝对定位子元素宽度的一半。

JSFiddle 示例:http://jsfiddle.net/Gmmqh/5/

请注意使用 box-sizing: border-box 使框彼此均匀，就像第三个一样。