Question

经过多次研究和测试后，我仍然不明白如何正确修复margin-auto＆amp;浮动：左问题。

您可以在此处找到我的代码： http://jsfiddle.net/pierrearfarf/6VfMh/

使用这个解决方案，div #projets没有高度，我不知道如何解决这个问题。 visualy我的解决方案有效，但似乎很奇怪。有人能告诉我是否有更好的解决方案吗？

HTML

<div id="main">
    <div id="content_wrapper">
        <div id="projets">
            <ul id="projets_content">
                <li class="projet">test 1</li>
                <li class="projet">test 2</li>
                <li class="projet">test 2</li>
            </ul>
        </div>
   </div>
</div>

CSS

#main{
float:left;
width:100%;
margin:0px;
padding:0px;    
}
#content_wrapper{
float:left;
    width:100%;
border:1px solid cyan;
margin-top:15px;
}

#projets{
width:160px;
border:1px solid black;
margin:10px auto;
}   

ul#projets_content{
float:left;
width:100%;
padding:0px;
border:1px solid blue;
list-style:none;
text-align:left;
}

ul#projets_content li {
width:35px;
margin:0px;
border:1px solid red;
float: left;
}

Answer 1

http://jsfiddle.net/6VfMh/1/

我添加了以下内容

#projets {
    display: inline-block;
}

和

#content_wrapper {
   text-align: center;
}

保证金自动，浮动和父高

1 个答案: