html - 如何 float 中心但仍然保持左浮动的属性

Question

所以我想 float 一些 div 的中心，原来我使用的是 float: left 这给了我这个样子 http://i.imgur.com/wfHacch.png在阅读了其他答案后，我发现我不能那样做，其中一个建议是使用 margin: 0 auto; 当我使用它时，它使所有内容都简单地堆叠在中间的一行中，因为根据这张图片 http://i.imgur.com/xyixrdj.png

我试图强制 float 的 div 统一居中堆叠。这也将适应较低屏幕尺寸的堆栈，

我怎样才能做到最好？

现在这是我的 CSS

.container {
    overflow: hidden;
    width: 100%;
    height: 100%;

}
.item {
    float: left;

    max-width: 500px;


    width: 100%;
    padding: 10px;
    height: 100%;


}
button {
    width: 33%;
    height: 100%;
    padding: 20px;
    background: orange;
    border: 1;
    border-radius: 10px;
    border: 1px;
    border-radius: 02px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);

}

还有我的 HTML

<div class="container orders">
<div class="item">
                <button class="ready">
                    /*content*/    

                </button>
            </div>
</div

Answer 1

你应该使用inline-block

div {
    display: inline-block
}

默认情况下，div 是 block 元素。