Question

我在另一个div里面有一个div这样的

<div id="outer">

  bla, bla.......

 <div id="inner">
  <p>Test</p>
 </div>
</div>

我希望inner-div的内容以apper为中心，最重要的是在div-div中。可以用css实现吗？

谢谢！

Answer 1

内部div始终位于外部div的顶部，如果内部div具有固定的宽度，则可以居中;

#inner {
    width: 100px; //any pixel value here
    margin: 0 auto;
}

Answer 2

全部关于保证金

<html>

<style>
#outer
{
    background-color:blue;
    width:400px;
    height:400px;
}
#inner
{
    background-color:green;
    width:200px;
    height:50px;
    margin-left:auto;margin-right:auto;/* <<< */
}

</style>
    <body>
        <div id="outer">

  bla, bla.......

 <div id="inner">
  <p>Test</p>
 </div>
</div>
    </body>
</html>

Answer 3

在使内部div以外部div为中心方面，您需要类似于以下代码的东西

<div id='outer'>
Blah Blah blah
<div id='Inner' style='margin: 0 auto; width: 200px;'>
<p>Test</p>
</div>
</div>

就最重要的问题而言，我建议将Blah Blah Blah文本放在内部DIV之下，正如通常预期的那样。

将div放在顶部并在另一个div中居中？

3 个答案: