margin 0 auto 元素元素并未居中的原因!

今天无意间写到一个例子发现,margin 0 auto 并未让div在另一个div里水平居中。我都有设置宽度

后来我发现,是因为我的子Div设置了浮动,导致margin 0 auto水平居中失效。原因是啥我不太明白?有各位小伙伴知道的,告诉我一下,感激不尽……

贴上例子:

  <title>浮动</title>
    <style>
        .container{
            width:400px;
            height:600px;
            background-color: #8ec63f;
            margin:0 auto;
        }
        .a2{
            width:200px;
            height:300px;
            background-color: mediumvioletred;
            margin: 0 auto;
            /*float:left;*/
        }
    </style>
</head>
<body>
<div class="container">
    <div class="a2"></div>
    <p></p>
</div>
</body>

 

posted @ 2017-08-14 14:21  千寻的天空之城  阅读(458)  评论(0编辑  收藏  举报