使用填充将子内部的孩子绝对定位

Question

我有一个载体元素（又名父级），其中包含另一个div作为子项。 父项具有填充。

我需要使用absolute垂直定位孩子但是我注意到这会弄乱孩子的宽度，这应该是100％（填充父母的整个宽度，服从边距）。

下面是一个例子codepen链路： http://codepen.io/anon/pen/yKzwb

P.S.我正在寻找一种以动态方式工作的解决方案，而不是手动设置每个可能的子内容的左值或右值。

我很确定有这个简单的解决方案;会爱记 -

Answer 1

我不知道这是否是最好的解决办法，但预期的结果是在这里：由 http://codepen.io/anon/pen/wjgmh

变化：

left: 64px; 
right: 64px; 
width: auto; 

还需要考虑肖恩Jermey答案通过把父母的相对价值。

编辑：仅做一个“动态的方式”我提出这个CSS选择器：

#parent > .child { 
//each generalize child behavior 
} 

Answer 2

如果我正确理解你的问题，你需要使用相对家长和变化填充保证金：

position: relative; 
margin: 64px; /* absolute is ignoring the padding attribrute */ 

例如：http://jsfiddle.net/o73pb7j4/

但是当你与其他的答案批评，多个孩子一个动态解决方案将难以实现得到控制而e使用绝对定位，因为每个孩子将从父母的顶部绝对位置。如果这与您的问题无关，请详细说明，因为我误解了您要查找的内容。

此链接可能是更多的帮助：

http://blog.vjeux.com/2012/css/css-absolute-position-taking-into-account-padding.html