将div放在一个绝对定位的div中

Question

我有两个div，一个在另一个里面。外部div的宽度以百分比给出，内部div以position:absolute给出。我想将内部div对齐在外部div的中心，而不考虑外部div的宽度百分比。

当从内部div中移除position:absolute时它工作正常，但我需要它。任何帮助将不胜感激。

我有以下代码：

<div class='container' style='width:70%; position:relative'>
   <div style='position:absolute; text-align:center' align='center'>
        //contents
   </div>
</div>

Answer 1

您可以执行以下操作：

1. 将text-align:center添加到.container div：

   .container{
       text-align:center;
   }
   

2. 如果您尝试在.container内将另一个div或图像等居中，则将这些项设置为具有以下margin:0 auto;，例如

   .container > div{
       margin: 0 auto;
       /* note that div needs to be a block element and needs a given width */
   }
   

这应该有助于解决您的问题。